一、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. (BFS 二叉树) leetcode 515. Find Largest Value in Each Tree Row

    You need to find the largest value in each row of a binary tree. Example: Input: 1 / \ 3 2 / \ \ 5 3 ...

  2. Altium Designer 18 ------ 原理图和PCB元器件互相查找

    方法一:单击选中原理图中元器件,然后单击tools>Seclect PCBcomponents,即可在PCB中看到该器件的高亮显示: 方法二:单击Tools>Cross Select Mo ...

  3. 2017-12-18python全栈9期第三天第四节之str的索引与切片

    #!/user/bin/python# -*- coding:utf-8 -*-s = 'zdlswwzl's1 = s[0]print(s1)s2 = s[-1]print(s2)s3 = s[0: ...

  4. 面向对象【day08】:异常处理(六)

    本节内容 1.概述 2.异常梳理 3.异常梳理流程图 4.异常大全 5.自定义异常 一.概述 异常处理是当程序出错了,但是我们又不想让用户看到这个错误,而且我在写程序的时候已经预料到了它可以出现这样的 ...

  5. Java工具之上传文件

    4个代码 1.前端JSP 2.自定义异常类 3.文件上传抽象类 4.Servlet 1.JSP <%@ page contentType="text/html;charset=UTF- ...

  6. 设计模式---状态变化模式之备忘录模式(Memento)

    一:概念 用于保存对象的内部状态,并在需要的时候(undo/rollback)回复对象以前的状态 二:应用场景 如果一个对象需要保存状态并可通过undo或rollback等操作恢复到以前的状态时,可以 ...

  7. ARM寄存器介绍

    ARM处理器共有37个寄存器.其中包括:31个通用寄存器,包括程序计数器(PC)在内.这些寄存器都是32位寄存器.以及6个32位状态寄存器.但目前只使用了其中12位.ARM处理器共有7种不同的处理器模 ...

  8. linux 精简开机自启动

    centos7 精简开机自启动 ntsysv rsyslog  crond  sshd network

  9. 【leetcode70】【动态规划】 爬楼梯

    (1 pass 一维动态规划) 爬楼梯(easy) 假设你正在爬楼梯.需要 n 阶你才能到达楼顶. 每次你可以爬 1 或 2 个台阶.你有多少种不同的方法可以爬到楼顶呢? 注意:给定 n 是一个正整数 ...

  10. hihoCoder #1457 : 后缀自动机四·重复旋律7(后缀自动机 + 拓扑排序)

    http://hihocoder.com/problemset/problem/1457 val[i] 表示状态i所表示的所有字符串的十进制之和 ans= ∑ val[i]在后缀自动机上,从起始状态走 ...