js数组对象排序详解

时间:2022-09-02 09:49:17

一、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数组对象排序详解

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

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

  1. Js 数组对象排序

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

  2. JS数组定义及详解

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

  3. PHP数组array&lowbar;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&lpar;&rpar;方法详解及高级技巧

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

  7. JS数组reduce&lpar;&rpar;方法详解及高级技巧

    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 ExpandableGridView的实现

    近期在做项目的时候碰到了这样一个布局 在android中有种实现折叠list方式是ExpandableListView  但是官方没有ExpandableGridView 那么怎么样用Expandab ...

  2. MBR结构和DBR结构

  3. java的基本认识

    一.java的特点: 1.跨平台性:不受计算机硬件及操作系统的约束而在任意计算机环境下运行. 2.面向对象:以对象为基本粒度,基下包含属性和方法. 3.安全性:语言级安全性.编译性安全性.运行时安全性 ...

  4. javascript 中文数字阿拉伯数字转换类 Nzh

    之前工作中碰到了数字转中文的情景,网上找的现成方法或多或少不合我的口味,最后还是自已写了一个. 现在整理了一下,补充了繁体,自定义字符,以及反函数(中文数字转阿拉伯数字) 现在发布出来,希望能合大家的 ...

  5. grep&sol;awk&sol;sed 或者 并且 否定

    Grep 'OR' Operator Find all the lines in a file, that match any of the following patterns. Using GRE ...

  6. Swift中的dispatch&lowbar;once 单例模式

    以下有三种方法实现单例模式,支持懒初始化和线程安全 全局变量 结构 dispatch_once 全局变量: 这里使用了全局变量而非类变量,是因为不支持类变量 private let _Singleto ...

  7. 201521123044 《Java程序设计》第6周学习总结

    1. 本章学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 注1:关键词与内容不求多,但概念之间的联系要清晰,内容覆盖 ...

  8. 前端 jQuery

    一.jQuery是什么? <1>jQuery由美国人John Resig创建,至今已吸引了来自世界各地众多JavaScript高手加入其team. <2>jQuery是继pro ...

  9. &period;net Core 调用微信Jsapi接口,H5解析二维码

    项目里需要用到扫描二维码,自己实现,不会. 找到了两种解决方案: 通过reqrcode.js,这是一个前端解析二维码内容的js库.如果二维码比较清晰,用这种效果也不错 调用微信扫一扫功能,这种效果很好 ...

  10. &lbrack;ci&rsqb;jenkins-slave-ssh docker容器化-用户名密码

    jenkins-slave-ssh docker容器化 架构 参考:https://www.youtube.com/watch?v=OxrBCt1JLuQ https://github.com/Dav ...