一、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 > val2) {
return 1;
} else {
return 0;
}
}
}
var arr=[{ name:"wlz", age:25},{ name:"wlz", age:5},{ name:"wlz", age:15},{ name:"wlz", age:3},{ name:"zlw", age:24}];
console.log(arr.sort(compare('age')))

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

js数组对象排序详解的更多相关文章

  1. Js 数组对象排序

    1.定义函数 /** * 数组对象排序函数 * @param {any} name 排序字段 * @param {any} order 升.降(这里事true.false记得处理下) */ var b ...

  2. JS数组定义及详解

    1.什么是数组 数组就是一组数据的集合 其表现形式就是内存中的一段连续的内存地址 数组名称其实就是连续内存地址的首地址 2.关于js中的数组特点 数组定义时无需指定数据类型 数组定义时可以无需指定数组 ...

  3. PHP数组array_multisort排序详解

    今天特意再看了下官网的介绍,对它的多个数组的排序还是每台理解,找了些资料深入理解了下,在此总结下. PHP中array_multisort函数对多个数组或多维数组进行排序,关联(string)键名保持 ...

  4. js数组sort方法详解

    在处理数组的时候,我们有时候需要对数组进行排序,排序的方法有很多种,但是最好最快的就是利用sort方法进行快速的排序. 我们来看一个例子: var arr1 = [6, 3, 4, 1, 2, 5, ...

  5. Java 对象排序详解

    很难想象有Java开发人员不曾使用过Collection框架.在Collection框架中,主要使用的类是来自List接口中的ArrayList,以及来自Set接口的HashSet.TreeSet,我 ...

  6. JS进阶篇--JS数组reduce()方法详解及高级技巧

    基本概念 reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被 ...

  7. JS数组reduce()方法详解及高级技巧

    1.语法 arr.reduce(callback,[initialValue]) reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上 ...

  8. JS 数组的常用方法详解归纳之改变原数组方法

    shift() 把数组的第一个元素从其中删除,并返回第一个元素的值, 如果数组是空的,那么 shift() 方法将不进行任何操作,返回 undefined 值.请注意,该方法不创建新数组,而是直接修改 ...

  9. 常见 js 数组方法使用详解

    数组常用方法总结 concat filter map some every reduce sort includes join some every 语法:array.every(function(c ...

随机推荐

  1. Android SDK中的Support兼容包详解

    这篇文章主要介绍了Android SDK中的Support兼容包详解,本文详细区分了Support Library的版本区别.各种Theme的概念和使用注意事项等内容,需要的朋友可以参考下 背景 来自 ...

  2. JSP页面规格化

    http://doc.okbase.net/%E4%BA%BA%E7%94%9F%E9%9A%BE%E5%BE%97%E7%B3%8A%E6%B6%82/archive/123084.html htt ...

  3. Timer A UP mode 中断

    Timer_A, Toggle P1.0, CCR0 Up Mode ISR, DCO SMCLK //  Description: Toggle P1.0 using software and TA ...

  4. Rails 拉数据初始数据库

    rails c   [1] pry(main)> Scraping.exec

  5. HTML Email 编写指南

    今天,我想写一个"低技术"问题. 话说我订阅了不少了新闻邮件(Newsletter),比如JavaScript Weekly.每周收到一封邮件,了解本周的大事. 有一天,我就在想, ...

  6. roundabout旋转幻灯

    jquery.roundabout.js文件/** * jQuery Roundabout - v2.4.2 * http://fredhq.com/projects/roundabout * * M ...

  7. 2243: [SDOI2011]染色(树链剖分+线段树)

    2243: [SDOI2011]染色 Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 8400  Solved: 3150[Submit][Status ...

  8. JQuery 总结

     JQuery官方网站 http://jquery.com/ 1.JQuery概念 A.Jquery是一个优秀的Javascript框架.它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器,jQu ...

  9. [Swift通天遁地]五、高级扩展-(11)图像加载Loading动画效果的自定义和缓存

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  10. 最大正方形 同luogu1387

    这道题下面这么写就够了(n<=100)暴力,枚举 #include<bits/stdc++.h> #define ULL unsigned long long #define MAX ...