JavaScript对象数组排序实例方法浅析


Posted in Javascript onJune 15, 2016

 在javascript中实现多维数组、对象数组排序,基本上都是用原生的sort()方法,用于对数组的元素进行排序。

其基本的用法就不说了,先看个简单的排序例子:

//Sort
alphabetically and ascending:
var
myarray=["Bob",
"Bully",
"Amy"]
myarray.sort()
//Array
now becomes ["Amy", "Bob", "Bully"]

数组直接调用sort()后,数组按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。

再来看看数字的排序:

//Sort
numerically and ascending:
var
myarray=[25, 8, 7, 41]
myarray.sort(function(a,b){return
a - b}) //Array
now becomes [7, 8, 25, 41]

sort(fun)接受了个排序规则函数,这个函数将比较2个数字的大小。而我们的对象数组排序,实际上原理也是一样的。

对于对象数组排序,我们先写一个构造比较函数的函数:

//by函数接受一个成员名字符串做为参数
//并返回一个可以用来对包含该成员的对象数组进行排序的比较函数
var
by = function(name){
return
function(o,
p){
var
a, b;
if
(typeof
o === "object"
&& typeof
p === "object"
&& o && p) {
a
= o[name];
b
= p[name];
if
(a === b) {
return
0;
}
if
(typeof
a === typeof
b) {
return
a < b ? -1 : 1;
}
return
typeof 
a < typeof
b ? -1 : 1;
}
else
{
throw
("error");
}
}
}

要排序的数组:

var
employees=[]
employees[0]={name:"George",
age:32, retiredate:"March
12, 2014"}
employees[1]={name:"Edward",
age:17, retiredate:"June
2, 2023"}
employees[2]={name:"Christine",
age:58, retiredate:"December
20, 2036"}
employees[3]={name:"Sarah",
age:62, retiredate:"April
30, 2020"}

直接调用函数:

employees.sort(by("age"));

到这里,对象数组排序就算基本实现了。那如何实现多个键值排序呢?意思就是先是对age排序,如果age相同,再比较name。
这时,我们可以进一步修改by函数,让其可以接受第二个参数,当主要的键值产生一个匹配的时候,另一个compare方法将被调用以决出高下。

//by函数接受一个成员名字符串和一个可选的次要比较函数做为参数
//并返回一个可以用来包含该成员的对象数组进行排序的比较函数
//当o[age]
和 p[age] 相等时,次要比较函数被用来决出高下
var
by = function(name,minor){
return
function(o,p){
var
a,b;
if(o
&& p && typeof
o === 'object'
&& typeof
p ==='object'){
a
= o[name];
b
= p[name];
if(a
=== b){
return
typeof 
minor === 'function'
? minor(o,p):0;
}
if(typeof
a === typeof
b){
return
a <b ? -1:1;
}
return
typeof 
a < typeof
b ? -1 : 1;
}else{
thro("error");
}
}
}
employees.sort(by('age',by('name')));

好了,现在可以放心使用了。如果看不懂,可直接copy 这个by函数到你的应用里面,直接调用即可。

以上所述是小编给大家介绍的JavaScript对象数组排序实例方法浅析的全部叙述,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript addBookmark 加入收藏 多浏览器兼容
Aug 15 Javascript
js字符串转成JSON
Nov 07 Javascript
Js判断CSS文件加载完毕的具体实现
Jan 17 Javascript
javascript不同类型数据之间的运算的转换方法
Feb 13 Javascript
JavaScript 经典实例日常收集整理(常用经典)
Mar 30 Javascript
值得分享的bootstrap table实例
Sep 22 Javascript
js实现table添加行tr、删除行tr、清空行tr的简单实例
Oct 15 Javascript
Angular 2应用的8个主要构造块有哪些
Oct 17 Javascript
jquery 标签 隔若干行加空白或者加虚线的方法
Dec 07 Javascript
微信小程序实现手势图案锁屏功能
Jan 30 Javascript
浅析vue给不同环境配置不同打包命令
Aug 17 Javascript
element-ui中el-upload多文件一次性上传的实现
Dec 02 Javascript
JavaScript实现点击文本自动定位到下拉框选中操作
Jun 15 #Javascript
JavaScript对象数组如何按指定属性和排序方向进行排序
Jun 15 #Javascript
jQuery动态加载css文件实现方法
Jun 15 #Javascript
异步加载JS、CSS代码(推荐)
Jun 15 #Javascript
全面解析Javascript无限添加QQ好友原理
Jun 15 #Javascript
漫谈JS引擎的运行机制 你应该知道什么
Jun 15 #Javascript
JavaScript操作 url 中 search 部分方法函数
Jun 15 #Javascript
You might like
PHP内核探索之变量
2015/12/22 PHP
Yii Framework框架使用PHPExcel组件的方法示例
2019/07/24 PHP
[原创]js获取数组任意个不重复的随机数组元素
2010/03/15 Javascript
JavaScript高级程序设计 错误处理与调试学习笔记
2011/09/10 Javascript
javascript开发随笔二 动态加载js和文件
2011/11/25 Javascript
浮动的div自适应居中显示的js代码
2013/12/23 Javascript
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
2014/08/12 Javascript
jQuery中:checked选择器用法实例
2015/01/04 Javascript
JavaScript中定义函数的三种方法
2015/03/12 Javascript
JavaScript 函数的定义-调用、注意事项
2017/04/16 Javascript
jQuery开源组件BootstrapValidator使用详解
2017/06/29 jQuery
jQuery 防止相同的事件快速重复触发方法
2018/02/08 jQuery
vue 全选与反选的实现方法(无Bug 新手看过来)
2018/02/09 Javascript
JavaScript对象拷贝与赋值操作实例分析
2018/12/10 Javascript
微信小程序实现二维码签到考勤系统
2020/01/16 Javascript
node.js使用zlib模块进行数据压缩和解压操作示例
2020/02/12 Javascript
vue实现自定义多选按钮
2020/07/16 Javascript
vue 子组件和父组件传值的示例
2020/09/11 Javascript
mysql 之通过配置文件链接数据库
2017/08/12 Python
Python3.5编程实现修改IIS WEB.CONFIG的方法示例
2017/08/18 Python
Python输出\u编码将其转换成中文的实例
2018/12/15 Python
详解pandas.DataFrame中删除包涵特定字符串所在的行
2019/04/04 Python
python网络编程之多线程同时接受和发送
2019/09/03 Python
Pandas时间序列重采样(resample)方法中closed、label的作用详解
2019/12/10 Python
解决Python3.7.0 SSL低版本导致Pip无法使用问题
2020/09/03 Python
python如何快速拼接字符串
2020/10/28 Python
关于Python3的import问题(pycharm可以运行命令行import错误)
2020/11/18 Python
护理学毕业生自荐信
2013/10/02 职场文书
财务总监管理职责范文
2014/03/09 职场文书
学生安全责任书
2014/04/15 职场文书
补充协议书范本
2014/04/23 职场文书
大学生个人先进事迹材料范文
2014/05/03 职场文书
新闻稿件写作技巧
2015/07/18 职场文书
Docker官方工具docker-registry案例演示
2022/04/13 Servers
css3属性选择器 “~”(波浪号) “,”(逗号) “+”(加号)和 “>”(大于号)
2022/04/19 HTML / CSS
详解Go语言中Get/Post请求测试
2022/06/01 Golang