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 相关文章推荐
利用JQuery和Servlet实现跨域提交请求示例分享
Feb 12 Javascript
JS去掉第一个字符和最后一个字符的实现代码
Feb 20 Javascript
如何将php数组或者对象传递给javascript
Mar 20 Javascript
jQuery中:empty选择器用法实例
Dec 30 Javascript
jQuery+PHP+MySQL二级联动下拉菜单实例讲解
Oct 27 Javascript
JQuery控制图片由中心点逐渐放大效果
Jun 26 Javascript
vuejs2.0运用原生js实现简单的拖拽元素功能示例
Feb 24 Javascript
bootstrap栅格系统示例代码分享
May 22 Javascript
jQuery简介_动力节点Java学院整理
Jul 04 jQuery
新手入门带你学习JavaScript引擎运行原理
Jun 24 Javascript
layui表单提交到后台自动封装到实体类的方法
Sep 12 Javascript
jquery validate 实现动态增加/删除验证规则操作示例
Oct 28 jQuery
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之数据库操作详解及乱码解决!
2007/01/02 PHP
php下尝试使用GraphicsMagick的缩略图功能
2011/01/01 PHP
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
分享十款最出色的PHP安全开发库中文详细介绍
2015/03/22 PHP
PHP 数组基本操作小结(推荐)
2016/06/13 PHP
老生常谈文本文件和二进制文件的区别
2017/02/27 PHP
php提交表单时保留多个空格及换行的文本样式的方法
2017/06/20 PHP
phpstorm 配置xdebug的示例代码
2019/03/31 PHP
laravel 解决Eloquent ORM的save方法无法插入数据的问题
2019/10/21 PHP
jQuery 入门讲解1
2009/04/15 Javascript
js相册效果代码(点击创建即可)
2013/04/16 Javascript
JQuery的Pager分页器实现代码
2016/05/03 Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
2017/11/28 Javascript
vue项目总结之文件夹结构配置详解
2017/12/13 Javascript
Vue开发实现吸顶效果的示例代码
2018/08/21 Javascript
如何在Angular8.0下使用ngx-translate进行国际化配置
2019/07/24 Javascript
[03:38]2014DOTA2西雅图国际邀请赛 VG战队巡礼
2014/07/07 DOTA
Python获取脚本所在目录的正确方法
2014/04/15 Python
Django框架中render_to_response()函数的使用方法
2015/07/16 Python
使用python实现生成用户信息
2017/03/20 Python
python实现连连看辅助(图像识别)
2020/03/25 Python
python解释器spython使用及原理解析
2019/08/24 Python
Django实现CAS+OAuth2的方法示例
2019/10/30 Python
Python PyQt5整理介绍
2020/04/01 Python
解决keras模型保存h5文件提示无此目录问题
2020/07/01 Python
Python SQLAlchemy库的使用方法
2020/10/13 Python
J2SDK1.5与J2SDK5.0有什么区别
2012/09/19 面试题
英语系毕业生自荐信
2013/10/31 职场文书
零件设计自荐信范文
2013/11/27 职场文书
英文自荐信
2013/12/19 职场文书
市场营销职业生涯规划书范文
2014/01/12 职场文书
2014年社会实践活动总结范文
2014/04/29 职场文书
兴趣小组活动总结
2014/05/05 职场文书
养牛场项目建议书
2014/05/13 职场文书
志愿服务心得体会
2016/01/15 职场文书
银行柜员优质服务心得体会
2016/01/22 职场文书