对json对象遍历我们一般使用for in循环,或者Object.keys + 数组方法。在接触js以来听到过一种说法:

for in 遍历顺序是不可靠的

但是在实际开发中for in 循环也是按照其键值对的排列先后被遍历,直到遇见了下面的数据:

const data = {
"11": 11,
"2": 2,
"9": 9,
"1": 1
}
var dsd = JSON.stringify(a)
console.log(a); // { '1': 1, '2': 2, '9': 9, '11': 11 }
var keys = Object.keys(a)
console.log(keys); // [ '1', '2', '9', '11' ]
for(var i in a){
console.log(i); 1 2 9 11
}

遍历的时候按照数字从小到大排序了,为什么不能按照给定的顺序输出呢?

在文章5分钟彻底理解Object.keys中作者通过查阅ECMAscript规范,最后提供了如下的结论:

Object.keys在内部会根据属性名key的类型进行不同的排序逻辑。分三种情况:

  1. 如果属性名的类型是Number,那么Object.keys返回值是按照key从小到大排序
  2. 如果属性名的类型是String,那么Object.keys返回值是按照属性被创建的时间升序排序。
  3. 如果属性名的类型是Symbol,那么逻辑同String相同

也就是说在使用到数字型的key的时候,需要特别注意,遍历出来的顺序和想要的可能会不一致

自己也查看了下for in 部分的规范,其中问题出现在 object.[[OwnPropertyKeys]] ,该方法规范地址在这儿,其中就是定义了上面的结论。

直接或者间接使用 object.[[OwnPropertyKeys]]的 API还有如下:

  1. Object.entries 规范地址
  2. Object.values 规范地址
  3. Object.getOwnPropertyNames 规范地址
  4. Reflect.ownKeys 规范地址
  5. Object.keys (规范地址)

json对象遍历顺序问题的更多相关文章

  1. 用递归将嵌套的JSON对象遍历出来,转为二维数组

    如题所示,代码如下: var arJsonNesting = [{id:1,name:"zhang3" ,children:[{id:2,name:"zhang33&qu ...

  2. JS对JSON对象遍历输出的时候真的是按照顺序输出吗?

    对象的遍历输出并不是按照对象属性定义顺序来的,那么是按照什么规则来的呢,仔细深入研究你会发现,这还跟浏览器有关系,Chrome跟IE是不一样的,所以给出以下结论: Chrome Opera 的 Jav ...

  3. JSON对象遍历方法

    JSON对象提前不知道其属性和结构,遍历其值 var json2 = { "name": "txt1", "name2": "tx ...

  4. Json对象遍历

    var json = {"id":"123","name":"tom","sex":"ma ...

  5. 用递归将嵌套的JSON对象遍历出来,转为二维数组 或一维数组

    var map = new Array();//二维数组 var map2 = new Array();//一维数组 for (var i = 0; i < e.Data.length; i++ ...

  6. js对象遍历输出顺序错乱的问题

    一.js对象遍历顺序错乱的原因 下边就来实践一下: var obj={'3':'ccc',name:'abc',age:23,school:'sdfds',class:'dfd',hobby:'dsf ...

  7. js遍历json对象

    原生js遍历json对象 遍历json对象: 无规律: <script> var json = [ {dd:'SB',AA:'东东',re1:123}, {cccc:'dd',lk:'1q ...

  8. JS JSON对象相关

    1.多对象合并 将2个或2个以上对象(object{....})中的属性进行合并,即最后合并为一个object{.....} 解决办法:Object.assign 方法 var form = {nam ...

  9. JSON数组,JSON对象,数组的区别与基本操作整理

    JSON 语法规则 JSON 语法是 javascript 对象表示语法的子集. 数据在名称/值对中 数据由逗号分隔 花括号保存对象 方括号保存数组 JSON 名称/值对 JSON 数据的书写格式是: ...

随机推荐

  1. luogu P3180 [HAOI2016]地图 仙人掌 线段树合并 圆方树

    LINK:地图 考虑如果是一棵树怎么做 权值可以离散 那么可以直接利用dsu on tree+树状数组解决. 当然 也可以使用莫队 不过前缀和比较难以维护 外面套个树状数组又带了个log 套分块然后就 ...

  2. luogu P5289 [十二省联考2019]皮配 背包

    LINK:皮配 我承认是一道很难的题目. 不过对于这道题 部分分的提示显得尤为重要. 首先是 40分的暴力dp 很容易想 但是不容易写. 从40分可以发现我们只需要把蓝阵营和鸭派系的人数给存在起来就行 ...

  3. java数组输出的三种方式

    第一种:foreach语句遍历输出 //通过foreach语句遍历输出数组 int nums[] = new int [4]; for (int num:nums) { System.out.prin ...

  4. Go语言入门系列(四)之map的使用

    本系列前面的文章: Go语言入门系列(一)之Go的安装和使用 Go语言入门系列(二)之基础语法总结 Go语言入门系列(三)之数组和切片 1. 声明 map是一种映射,可以将键(key)映射到值(val ...

  5. JVM系列之:从汇编角度分析NullCheck

    目录 简介 一个普通的virtual call 普通方法中的null check 反优化的例子 总结 简介 之前我们在讲Virtual call的时候有提到,virtual call方法会根据传递的参 ...

  6. 内网 Maven 编译

    内网 Maven 编译 有个特殊的需求,在不联网的情况下编译 Java 项目. 想到两种方案: 搭建 Nexus 私有镜像仓库. 直接把依赖 jar包 放在编译机的 maven 本地库中. 步骤简述 ...

  7. SkyWalking 搭建及简单使用(Linux)

    1.需求 公司项目采用微服务的架构,服务很多,人工监控是不可能的,项目的访问量很大,想通过日志查找某个方法中性能的问题也是非常困难的.但是系统的性能问题是不能忽视的.系统性能检测的问题如鲠在喉,经过长 ...

  8. OpenCV之高斯平滑(Python实现)

    假设一个列数为W,行数为H的高斯卷计算子gaussKernel,其中W,H均为奇数,描点位置在((H-1)/2 ,(W-1)/2),构建高斯卷积核的步骤如下 1.计算高斯矩阵 \[gaussMatri ...

  9. 【Redis】Redis开篇与如何安装单机版Redis,这次我会了!!

    写在前面 很早之前,就有不少小伙伴微信留言说:冰河,你能不能写一个Redis专栏啊,我最近在学习Redis,看书看不下去,学习视频又觉得视频太长了,还是看你的文章比较给力!哈哈,原来我写的文章能够让小 ...

  10. vue scss 样式穿透

    使用2个style的方式不够优雅,可以使用下面方式做样式穿透 .normal-field /deep/ .el-form-item { margin-bottom: 0px; } .normal-fi ...