深入聊聊Array的sort方法的使用技巧.详细点评protype.js中的sortBy方法
2018-09-23 20:32
Array.prototype.sort方法是对数组进行排序,该方法带一个函数参数,用来指定排序的规则.
我们先来看看sort的简单应用:
vararr=[2,1,3,4];
alert(arr.sort())//[1,2,3,4]从小到大排列
//现在由大到小排列得到[4,3,2,1]
alert(arr.sort(function(left,right){returnleft>right?-1:1}))
//这里,sort方法通过参数函数的返回值1或者-1来决定是顺排还是倒排
还记得我以前和大家说过的利用Function.apply方法来获取数组中的最大元素的方法吗?
文中用了两种不同的方法来获取数组中的最大值.
现在sort也可以来秀一下了.
vararr=[2,1,3,4];
varminValue=arr.sort()[0];
varmaxValue=arr.sort()[arr.length-1]//arr.sort().pop()
怎么样,这也是一种另类实现方法吧,还不用写循环遍历.
不过,我必须要指出的是,这种方法的效率是最低的,对于几十个百来个元素的数组,你还是可以使用这种技巧.
但是,如果数组很大,用sort()方法可以慢得让你想抽烟
进一步讨论sort对复杂数据结构的排序.
1.对多维数组的排序
vararr=[
[2,1,55,4],
[5,3,22,3],
[1,2,77,2],
[9,4,33,5],
];
alert(默认按第一列排\n+arr.sort().join(\n))
alert(现在按第三列排\n+arr.sort(function(left,right){returnleft[2]>right[2]?1:-1}).join(\n))
alert(现在按第三列倒排\n+arr.sort(function(left,right){returnleft[2]>right[2]?-1:1}).join(\n))
2.对复杂数据结构的排序
Array.prototype.each=function(f){for(vari=0;i<this.length;i++)f(this[i],i,this)}
vararr=[
{name:bill,money:500},
{name:go_rush,money:400},
{name:dudu,money:9000}
];
//依次显示dudu,bill,go_rush看来dudu是最有钱的,而我是最穷的
arr.sort(function(left,right){returnleft.money>right.money?-1:1}).each(showName)
3.对表格的排序,这个话题我昨天和大家聊过了.
参见:
更复杂的表格排序(也是用Array的sort函数):
4.Protype.js中对sort有一个构思非常巧妙的扩展,先看他的代码
1sortBy:function(iterator){
3return{value:value,criteria:iterator(value,index)};
4}).sort(function(left,right){
5vara=left.criteria,b=right.criteria;
6returna<b?-1:a>b?1:0;
7}).pluck(value);
8},
这个sortBy允许传入一个函数,并把数组的每一个元素作为参数执行该函数,最后对函数返回的结果排序.
下面我来分解他的这个函数.
collect方法实际就是map方法.相当于
Array.prototype.map=function(f){
for(vari=0;ret=[];i<this.length;i++)ret[i]=f(this[i],i,this)
returnret
}
比如,现在
arr=[2,1,4,3]
iterator=function(x){returnx*x}
1-3行代码就得到了这样一个数组
[
{value:2,criteria:4},
{value:1,criteria:1},
{value:4,criteria:16},
{value:3,criteria:9}
]
4-6行代码就对数组按criteria:进行排序,由小到大.排完得到
[
{value:1,criteria:1},
{value:2,criteria:4},
{value:3,criteria:9},
{value:4,criteria:16}
]
第7行代码最简单了,取每个元素的value属性,最终得到[1,2,3,4]实现对arr的sortBy(function...)排序
可能我的语言表达能力有限啊,说prototype.js的sortBy的时候硬是不知怎么用文字表达为好.
害得大家那么辛苦看我写的解说代码,实在是不好意思!
下一篇:JavaScript面象对象设计
文章标题:深入聊聊Array的sort方法的使用技巧.详细点评protype.js中的sortBy方法
文章链接:http://soscw.com/index.php/essay/17420.html