前言:最近用for-in时,看到说for-in不能保证遍历的对象顺序,对此有些疑问,于是便研究了下,本文做简要说明。

现象

let obj = {
a: 'a',
b: 'b',
1: 1,
2: 2
}
let obj2 = {
name: '张三',
age: 13,
gender: 'male'
}
for(key in obj){
console.log(key)
}
// 输出顺序为1,2,a,b
for(key in obj2){
console.log(key)
}
// 输出的顺序为name,age,gender

可以发现,for-in的迭代顺序不是按定义对象时的顺序(其实不需要for-in,直接输出对象或用Object.keys遍历都是一样的效果)

console.log(obj)// {1: 1, 2: 2, a: "a", b: "b"}
console.log(Object.keys(obj))// ["1", "2", "a", "b"]

那如果不是按定义的顺序,是按什么顺序呢?看obj1像是ASC码升序遍历,但看obj2又不是。

结论

根据http://w3help.org/zh-cn/causes/SJ9011可以得知

  • 不同版本的ECMA规范,for-in的遍历顺序的的标准不一样:ECMA-262(ECMAScript)第三版中,遍历顺序为对象定义时属性的书写顺序决定的;最新的 ECMA-262(ECMAScript)第五版中,遍历顺序没有被规定。不同的浏览器引擎采用的规范可能不同,所以输出的顺序也就不一样
  • Chrome Opera 中使用 for-in 语句遍历对象属性时会遵循一个规律,它们会先提取所有 key 的 parseFloat 值为非负整数的属性, 然后根据数字顺序对属性排序首先遍历出来,然后按照对象定义的顺序遍历余下的所有属性。其它浏览器则完全按照对象定义的顺序遍历属性。

说明:以上第二点,我在IE浏览器中测试过,并不是按对象定义的顺序输出,而是和chrome表现一样,都是按上部分【现象】中的表现输出。

结论:虽然没能完全确定for-in的遍历顺序,但可以知道此顺序不是唯一的,在不同的环境下可能会有不能的表现,所以我们不能依赖for-in来按某种特定顺序来遍历对象

js中对象的输出顺序的更多相关文章

  1. 基础篇:1.JavaScript运行在html中,引用有几种方式?—— 6.js中常用的输出方式?

    书接上文,上文提到若干条JavaScript的基础性知识,大部分都是一些概念性的东西,本着认真严谨的态度,我们要认真对待,有些条目的问题是某个知识点的周边延伸,为节约篇幅,就一起整理了,如有描述不对的 ...

  2. js中对象转化成字符串、数字或布尔值的转化规则

    js中对象可以转化成 字符串.数字.布尔值 一.对象转化成字符串: 规则: 1.如果对象有toString方法,则调用该方法,并返回相应的结果:(代码通常会执行到这,因为在所有对象中都有toStrin ...

  3. [转]JS中对象与字符串的互相转换

    原文地址:http://www.cnblogs.com/luminji/p/3617160.html 在使用 JSON2.JS 文件的 JSON.parse(data) 方法时候,碰到了问题: thr ...

  4. JS中对象与字符串的互相转换

    在使用 JSON2.JS 文件的 JSON.parse(data) 方法时候,碰到了问题: throw new SyntaxError('JSON.parse'); 查询资料,大概意思如下: JSON ...

  5. js中对象的一些特性,JSON,scroll家族

    一.js中对象的一些特性 对象的动态特性 1.当对象有这个属性时,会对属性的值重写 2.当对象没有这个属性时,会为对象创建一个新属性,并赋值 获得对象的属性的方式 为元素设置DOM0级事件 二.JSO ...

  6. 【转载】js中对象的使用

    原文链接:http://www.jb51.net/article/90256.htm[侵删] 简单记录javascript中对象的使用 一.创建对象 //创建一个空对象 var o={}; //创建一 ...

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

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

  8. js中对象的创建

    json方式,构造函数方式,Object方式,属性的删除和对象的销毁 <html> <head> <title>js中的对象的创建</title> &l ...

  9. JS中对象按属性排序(冒泡排序)

    在实际工作经常会出现这样一个问题:后台返回一个数组中有i个json数据,需要我们根据json中某一项进行数组的排序. 例如返回的数据结构大概是这样: { result:[ {id:,name:'中国银 ...

随机推荐

  1. pandas数据结构之Panel笔记

    Panel创建的是三维的表 items:坐标轴0,索引对应的元素是一个DataFrame major_axis:坐标轴1,DataFrame里的行标签 minor_axis:坐标轴2,DataFram ...

  2. react以组件为中心的代码分割和懒加载

    背景 随着项目越来越复杂,功能够越来越多,JS单个文件就会比较臃肿,js代码拆分显得必不可少. Js文件拆分主要分为按照路由进行js拆分.按照组件进行js拆分. 按照路由拆分:因为本项目请求路径得原因 ...

  3. [JZOJ5888]GCD生成树

    [JZOJ5888]GCD生成树 题目链接 gugugu 分析 对于N很小的情况,暴力Prim即可 对于值域很小的情况,我的想法与solution不太一样,将值相同的缩成一个点,\(O(w^2)\)预 ...

  4. python运行报错:cannot import name 'InteractiveConsole'

    ModuleNotFoundError: No module named '_pydevd_bundle.pydevd_cython' ImportError: cannot import name ...

  5. 为什么领域模型对于架构师如此重要? https://blog.csdn.net/qq_40741855/article/details/84835212

    为什么领域模型对于架构师如此重要? https://blog.csdn.net/qq_40741855/article/details/84835212 2018年12月05日 14:30:19 绝圣 ...

  6. svg-sprite-loader ( svg-icon) 使用

    svg-sprite-loader 可以多个svg图标合并. 使用时只需根据合并的symbol的id即可.  <svg class="svg-icon" aria-hidde ...

  7. mysql5.7解压包安装教程

    下载mysql5.7解压包Download MySQL Community Server,解压文件.https://dev.mysql.com/downloads/mysql/ 步骤1:新建my.in ...

  8. Java 之 JDK9 对集合添加的优化

    通常,在代码中创建一个集合(例如,List 或 Set ),并直接用一些元素填充它. 实例化集合,几个 add方法调用,使得代码重复. Java 9,添加了几种集合工厂方法,更方便创建少量元素的集合. ...

  9. modelsim仿真xilinx ram输出均为0

    现象 在vivado2018.3下生成了RAM IP,丢到modelsim中仿真发现doutb输出均为0.调整AB端口的时钟速率,发现低于5ns不行,输出为0.但5ns以上正常. 解决方法 比对了vi ...

  10. linux命令安装docker

    安装: 1.Docker要求CentOS系统的内核版本高于 3.10 ,通过 uname -r 命令查看你当前的内核版本是否支持安账docker 2.更新yum包:sudo yum update 3. ...