一、js对象遍历顺序错乱的原因

下边就来实践一下:

var obj={'3':'ccc',name:'abc',age:23,school:'sdfds',class:'dfd',hobby:'dsfd'};
Object.keys(obj)

输出:["3", "name", "age", "school", "class", "hobby"];

换一下对象顺序,

var obj={name:'abc','3':'ccc',age:23,school:'sdfds',class:'dfd',hobby:'dsfd'};
Object.keys(obj)

输出:["3", "name", "age", "school", "class", "hobby"]

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

Chrome Opera 的 JavaScript 解析引擎遵循的是新版 ECMA-262 第五版规范。因此,使用 for-in 语句遍历对象属性时遍历书序并非属性构建顺序。
而 IE6 IE7 IE8 Firefox Safari 的 JavaScript 解析引擎遵循的是较老的 ECMA-262 第三版规范,属性遍历顺序由属性构建的顺序决定。

Chrome Opera 中使用 for-in 语句遍历对象属性时会遵循一个规律:
它们会先提取所有 key 的 parseFloat 值为非负整数的属性,然后根据数字顺序对属性排序首先遍历出来,然后按照对象定义的顺序遍历余下的所有属性。

那么,解决办法呢?

可以把对象通过Object.keys提取对象的key出来变成数组,然后通过数组的排序,然后遍历数组,通过key去取对象的属性值。

二、js数组遍历排序方法

  大家都知道数组的遍历是按照顺序的,那么当一个数组中放了很多对象,想要按照对象的某个属性去排序数组需要怎么处理呢?

  1.定义一个方法:

var compare = function (prop) {
return function (obj1, obj2) {
var val1 = obj1[prop];
var val2 = obj2[prop];if (val1 < val2) {
return -1;
} else if (val1 >www.wmyl11.com  val2) {
return 1;
} else www.thd178.com {
return 0;
}
}
}
var arr=[{ name:"wlz", age:25},www.hjd1956.com{ name:"wlz",www.120xh.cn  age:5},{ name:"wlz", age:15},{ name:"wlz", age:3},{ name:"zlw", age:24}];
console.log(arr.sort(compare('age')))

最后这个数组就根据属性来做排序了。

js对象遍历输出顺序错乱的问题的更多相关文章

  1. js对象遍历

    js对象遍历可以使用比较普遍的方法:如下 var ss={aa:"aa",bb:"bb"}; for(var s in ss){ console.info(&q ...

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

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

  3. js中对象的输出顺序

    前言:最近用for-in时,看到说for-in不能保证遍历的对象顺序,对此有些疑问,于是便研究了下,本文做简要说明. 现象 let obj = { a: 'a', b: 'b', 1: 1, 2: 2 ...

  4. JS 对象遍历

    var orgRoot = { 271: {backgroundColor: '#f68f2b', textColor: '#FFFFFF'}, 272: {backgroundColor: '#49 ...

  5. js数组遍历和对象遍历

    针对js各种遍历作一个总结分析,从类型用处:分数组遍历和对象遍历:还有性能,优缺点等. JS数组遍历: 1,普通for循环,经常用的数组遍历 var arr = [1,2,0,3,9]; for ( ...

  6. JS数组&对象遍历

    遍历的总结,经常用到的,希望帮助你我成长. JS数组遍历: 1,普通for循环 var arr = [1,2,3,4,9]; for ( var i = 0; i <arr.length; i+ ...

  7. js中遍历对象的属性和值的方法

    鉴于循环目标是个对象,length是为undefined,用map等对数组的循环方法不行,对象就用此下方法 for(var key in _this.lists.medicines){ medicin ...

  8. json对象遍历顺序问题

    对json对象遍历我们一般使用for in循环,或者Object.keys + 数组方法.在接触js以来听到过一种说法: for in 遍历顺序是不可靠的 但是在实际开发中for in 循环也是按照其 ...

  9. js中遍历对象的属性和值

    今天想看一下js的数组遍历的内容,搜索到了一个关于对象遍历写好的函数,保留一下.以后好用. function allPrpos ( obj ) {   // 用来保存所有的属性名称和值   var p ...

随机推荐

  1. appium-基础搭建,适配,问题,优化,提速

    搭建开发环境,导入testng/log4j/maven 1.配置jdk环境 2.安装appium,下载eclipse-adt,配置appium环境 github.com/getlantern/foru ...

  2. noi.openjuge 2.6.90

    http://noi.openjudge.cn/ch0206/90/ 90:滑雪 总时间限制:  1000ms 内存限制:  65536kB 描述 Michael喜欢滑雪百这并不奇怪, 因为滑雪的确很 ...

  3. (编辑距离问题 线性DP) nyoj1431-DNA基因鉴定

    题目描述: 我们经常会听说DNA亲子鉴定是怎么回事呢?人类的DNA由4个基本字母{A,C,G,T}构成,包含了多达30亿个字符.如果两个人的DNA序列相差0.1%,仍然意味着有300万个位置不同,所以 ...

  4. (基础) 平方和与立方和 hdu2007

    平方和与立方和 链接:http://acm.hdu.edu.cn/showproblem.php?pid=2007 Time Limit: 2000/1000 MS (Java/Others)     ...

  5. Linux里的eval命令

      这个命令之前没有用过,在网上查了一下资料,觉得人家写的很好,所以复制过来了. 标题:linux命令eval的用法 链接:http://blog.chinaunix.net/uid-21411227 ...

  6. python IDLE颜色设置

    相信刚学习python的朋友们,都还是挺喜欢python自带的IDLE,但是白的代码背景色以及其它的代码色如何更改呢? Step1:找到config-Highlight.cfg文件,win在C:\Us ...

  7. docker-compose 案例

    官网示例: 安装wordpress version: " services: db: image: mysql:5.7 volumes: - db_data:/var/lib/mysql r ...

  8. Http接口开发(自测服务端客户端)

    一.  Http与Https的区别             1.概念       HTTP:是互联网上应用最为广泛的一种网络协议,是一个客户端和服务器端请求和应答的标准(TCP),用于从www服务器传 ...

  9. [JUC-1]并发包实现及线程状态

    一.Java 并发包实现 二.Java 线程状态转换图

  10. html基本进阶知识【转】

    inline和block的区别: 网页一般是两种元素组合起来的,一种是内联元素,也就是行内显示,加上width和height没效果.一种是区块元素,可以加上对应的width和height,通常使用在网 ...