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 相关文章推荐
Prototype使用指南之string.js
Jan 10 Javascript
禁止页面刷新让F5快捷键及右键都无效
Jan 22 Javascript
一看就懂:jsonp详解
Jun 01 Javascript
Treegrid的动态加载实例代码
Apr 29 Javascript
js实现各种复制到剪贴板的方法(分享)
Oct 27 Javascript
JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解
Nov 29 Javascript
AngularJs中 ng-repeat指令中实现含有自定义指令的动态html的方法
Jan 19 Javascript
详解webpack 多入口配置
Jun 16 Javascript
vue中倒计时组件的实例代码
Jul 06 Javascript
在iFrame子页面里实现模态框的方法
Aug 17 Javascript
MockJs结合json-server模拟后台数据
Aug 26 Javascript
原生JS实现音乐播放器的示例代码
Feb 25 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分页代码学习示例分享
2014/02/20 PHP
PHP中单引号与双引号的区别分析
2014/08/19 PHP
简单了解将WordPress中的工具栏移到底部的小技巧
2015/12/31 PHP
PHP+JQuery+Ajax实现分页方法详解
2016/08/06 PHP
PHP查询分页的实现代码
2017/06/09 PHP
使用 PHP Masked Package 屏蔽敏感数据的实现方法
2019/10/15 PHP
List the Codec Files on a Computer
2007/06/18 Javascript
javascript实现二分查找法实现代码
2007/11/12 Javascript
网络图片延迟加载实现代码 超越jquery控件
2010/03/27 Javascript
在VS2008中使用jQuery智能感应的方法
2010/12/30 Javascript
JS实现清除指定cookies的方法
2014/09/20 Javascript
jQuery调用WebMethod(PageMethod) NET2.0的方法
2016/04/15 Javascript
轻松掌握JavaScript状态模式
2016/09/07 Javascript
Vue.js实现无限加载与分页功能开发
2016/11/03 Javascript
Vue组件开发初探
2017/02/14 Javascript
微信小程序中页面FOR循环和嵌套循环
2017/06/21 Javascript
vue组件编写之todolist组件实例详解
2018/01/22 Javascript
关闭Vue计算属性自带的缓存功能方法
2018/03/02 Javascript
vue踩坑记-在项目中安装依赖模块npm install报错
2019/04/02 Javascript
javascript面向对象创建对象的方式小结
2019/07/29 Javascript
jquery轻量级数字动画插件countUp.js使用详解
2019/10/17 jQuery
jQuery实现开关灯效果
2020/08/02 jQuery
[37:29]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第二场 11.19
2020/11/19 DOTA
python不带重复的全排列代码
2013/08/13 Python
Eclipse和PyDev搭建完美Python开发环境教程(Windows篇)
2016/11/16 Python
python实现各进制转换的总结大全
2017/06/18 Python
对python操作kafka写入json数据的简单demo分享
2018/12/27 Python
python七夕浪漫表白源码
2019/04/05 Python
解决python中使用PYQT时中文乱码问题
2019/06/17 Python
复化梯形求积分实例——用Python进行数值计算
2019/11/20 Python
Python3和PyCharm安装与环境配置【图文教程】
2020/02/14 Python
如何理解Python中的变量
2020/06/01 Python
人力资源管理求职信
2014/08/07 职场文书
机关党员三严三实心得体会
2014/10/13 职场文书
2014年法院工作总结
2014/11/24 职场文书
2016年大学生暑期社会实践活动总结
2016/04/06 职场文书