js中对象的输出顺序
前言:最近用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.JavaScript运行在html中,引用有几种方式?—— 6.js中常用的输出方式?
书接上文,上文提到若干条JavaScript的基础性知识,大部分都是一些概念性的东西,本着认真严谨的态度,我们要认真对待,有些条目的问题是某个知识点的周边延伸,为节约篇幅,就一起整理了,如有描述不对的 ...
- js中对象转化成字符串、数字或布尔值的转化规则
js中对象可以转化成 字符串.数字.布尔值 一.对象转化成字符串: 规则: 1.如果对象有toString方法,则调用该方法,并返回相应的结果:(代码通常会执行到这,因为在所有对象中都有toStrin ...
- [转]JS中对象与字符串的互相转换
原文地址:http://www.cnblogs.com/luminji/p/3617160.html 在使用 JSON2.JS 文件的 JSON.parse(data) 方法时候,碰到了问题: thr ...
- JS中对象与字符串的互相转换
在使用 JSON2.JS 文件的 JSON.parse(data) 方法时候,碰到了问题: throw new SyntaxError('JSON.parse'); 查询资料,大概意思如下: JSON ...
- js中对象的一些特性,JSON,scroll家族
一.js中对象的一些特性 对象的动态特性 1.当对象有这个属性时,会对属性的值重写 2.当对象没有这个属性时,会为对象创建一个新属性,并赋值 获得对象的属性的方式 为元素设置DOM0级事件 二.JSO ...
- 【转载】js中对象的使用
原文链接:http://www.jb51.net/article/90256.htm[侵删] 简单记录javascript中对象的使用 一.创建对象 //创建一个空对象 var o={}; //创建一 ...
- js对象遍历输出顺序错乱的问题
一.js对象遍历顺序错乱的原因 下边就来实践一下: var obj={'3':'ccc',name:'abc',age:23,school:'sdfds',class:'dfd',hobby:'dsf ...
- js中对象的创建
json方式,构造函数方式,Object方式,属性的删除和对象的销毁 <html> <head> <title>js中的对象的创建</title> &l ...
- JS中对象按属性排序(冒泡排序)
在实际工作经常会出现这样一个问题:后台返回一个数组中有i个json数据,需要我们根据json中某一项进行数组的排序. 例如返回的数据结构大概是这样: { result:[ {id:,name:'中国银 ...
随机推荐
- ThreadLocal内存泄漏真因探究(转)
出处: 链接:https://www.jianshu.com/p/a1cd61fa22da ThreadLocal原理回顾 ThreadLocal的原理:每个Thread内部维护着一个ThreadLo ...
- 【C#】课堂知识点#1
标准数字格式字符串 https://docs.microsoft.com/zh-cn/dotnet/standard/base-types/standard-numeric-format-string ...
- C#类型转换工具类
using System; namespace Com.AppCode.Extend { public static partial class Ext { #region 数值转换 /// < ...
- (十二)Activitivi5之流程控制网关:排他
一.概念 所谓排他网关 顾名思义 执行到该网关,根据条件只能走一条执行线 二.案例 当流程走到“学生请假”任务节点的时候, /** * 完成任务 */ @Test public void test_c ...
- (四)Decorator设计模式解决GET/POST请求的乱码问题(转)
一.Decorator设计模式 1.1.Decorator设计模式介绍 当某个对象的方法不适应业务需求时,通常有2种方式可以对方法进行增强: 编写子类,覆盖需增强的方法. 使用Decorator设计模 ...
- javadoc 自动生成java帮助文档
用法: javadoc [options] [packagenames] [sourcefiles] 选项: -public 仅显示 public 类和成员 -protected 显示 protect ...
- opencv-02--图像的邻域操作
图像的邻域操作 很多时候,我们对图像处理时,要考虑它的邻域,比如3*3是我们常用的,这在图像滤波.去噪中最为常见,下面我们介绍如果在一次图像遍历过程中进行邻域的运算. 下面我们进行一个简单的滤波操作, ...
- export default和export的使用方式
在node中使用 var 名称=require('模块标识符') 来导入 module.exports 和exports 来暴露成员 在ES6中,也通过规范的形式,规定了ES6中如何导入和导出模块 E ...
- h5常见
Meta基础知识: H5页面窗口自动调整到设备宽度,并禁止用户缩放页面//一.HTML页面结构<meta name="viewport" content="widt ...
- JS 百度地图 地图线路描绘
JS 百度地图 地图线路描绘 <script type="text/javascript" src="http://api.map.baidu.com/api?v= ...