sort()函数是javascript中自带的一个函数,顾名思义,这个函数的功能就是排序,sort()函数在实际的应用中还是很多的,所以今天就来讲一下关于这个函数的简单使用。
sort()语法:
/**
* sortby: 可选,设置排序的逻辑,必须是函数。
*/
arrayObject.sort(sortby)
在使用sort()函数时,函数参数如果不设置的话,会以默认方式进行排序,就是以字母顺序进行排序,准确的讲就是按照字符编码的顺序进行排序。
var arr = [3,2,3,34,12,23,234,84,9];
arr.sort();
// 结果: 12,2,23,234,3,3,34,84,9
可是这个往往不是我们希望的结果。在实际项目中,我们常常要对价格,距离等做排序,针对数字大小的排序,我们可以自己单独写一个排序算法,例如:冒泡排序,选择排序,插入排序等,但javascript给我们提供了sort()函数,那我们为什么还要重复造轮子呢,况且造的还不“圆”
现在我们就来通过sort(sortby)函数自定义排序的逻辑。
// 升序
var arr = [3,2,3,34,12,23,234,84,9];
arr.sort(function (a, b) {
return a - b;
});
// 结果:2,3,3,9,12,23,34,84,234
// 降序
var arr = [3,2,3,34,12,23,234,84,9];
arr.sort(function (a, b) {
return b - a;
});
// 结果:234,84,34,23,12,9,3,3,2
在上述代码中,我们用一个匿名函数作为sort()的参数。在这个匿名函数中,a和b这两个参数我个人理解就是待排序数组中任意两个连续的元素,如果:
- a - b < 0: 代表后一个比前一个大,就是升序
- b - a < 0: 代表前一个比后一个大,就是降序
- a - b = 0 或 b - a = 0: 前后两个数相等
以上仅是个人想法,下面是w3school的解释:
- 若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
- 若 a 等于 b,则返回 0。
- 若 a 大于 b,则返回一个大于 0 的值。
现在,对于一个普通的数组排序,我们可以很容易的解决。但是在开发中,这样的普通数组也很少用。在做前端开发时,往往要配合后端的开发,而前后台的交互现在大都是用json格式的数据,比如这样的数据:
{
"user":[
{ "name": "has", "age": 17, "height": 165 },
{ "name": "saf", "age": 20, "height": 172 },
{ "name": "gngh", "age": 45, "height": 182 },
{ "name": "yjerw", "age": 42, "height": 156 },
{ "name": "cvb", "age": 22, "height": 176 },
{ "name": "wetty", "age": 32, "height": 178 },
{ "name": "aDNY", "age": 34, "height": 175 }
]
}
关于对象数组的排序,sort()函数同样是适用的。
对"age"排序:
// 按age升序排列
var arr = {
"user":[
{ "name": "has", "age": 17, "height": 165 },
{ "name": "saf", "age": 20, "height": 172 },
{ "name": "gngh", "age": 45, "height": 182 },
{ "name": "yjerw", "age": 42, "height": 156 },
{ "name": "cvb", "age": 22, "height": 176 },
{ "name": "wetty", "age": 32, "height": 178 },
{ "name": "aDNY", "age": 34, "height": 175 }
]
};
var users = arr.user;
users.sort(function (a, b) {
return a.age - b.age;
});
// 结果(升序):
/*
name:has age:17 height:165
name:saf age:20 height:172
name:cvb age:22 height:176
name:wetty age:32 height:178
name:aDNY age:34 height:175
name:yjerw age:42 height:156
name:gngh age:45 height:182
*/
如果对name排序呢?这时候就要用到这个函数localeCompare(),关于这个函数的使用请自行查看w3school。具体使用方法如下:
// 按name排列
var arr = {
"user":[
{ "name": "has", "age": 17, "height": 165 },
{ "name": "saf", "age": 20, "height": 172 },
{ "name": "gngh", "age": 45, "height": 182 },
{ "name": "yjerw", "age": 42, "height": 156 },
{ "name": "cvb", "age": 22, "height": 176 },
{ "name": "wetty", "age": 32, "height": 178 },
{ "name": "aDNY", "age": 34, "height": 175 }
]
};
var users = arr.user;
users.sort(function (a, b) {
return a.name - b.name;
});
// 结果:
/*
name:aDNY age:34 height:175
name:cvb age:22 height:176
name:gngh age:45 height:182
name:has age:17 height:165
name:saf age:20 height:172
name:wetty age:32 height:178
name:yjerw age:42 height:156
*/
可以看到这样的字符串排序就是按照字符的ASCII码来比较的。
上面就是我个人此阶段对于sort()函数的理解,功能还是很强大的,至于怎么强大了,这完全取决于sort()函数中的匿名函数了。
原文地址: javascript中sort()函数的理解