当前位置:首页  电脑知识  其它

js中.sort()函数的用法与高级操作

js中.sort()函数的用法与高级操作

日期:2023-10-10 21:40:17来源:浏览:

这是.sort()函数最常见的用法

//没有函数参数,按字符编码格式排序var arr = [3,2,3,34,12,23,234,84,9];arr.sort();// 结果: 12,2,23,234,3,3,34,84,9
// 需要升序或者降序则需要传入一个函数参数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;});

但或许你还对其为什么要这么操作存有一些疑惑

我们要先搞懂往.sort()里传入的函数的参数a,b是什么

sort()要排序就要遍历数组,以上面的数组为例子

其中遍历第一步的a=3、b=2,

第二步时候a=2、b=3,

第三步的时候a=3,b=34

。。。。。。。

就像你写的冒泡排序一样,每一个元素都会被对比到

如何排序呢?这是w3c对其的解释:

若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
若 a 等于 b,则返回 0。
若 a 大于b,则返回一个大于 0 的值。

也就是说,在传入的函数里如果你想a排在b前,就return一个小于0的数

如果你想a排在b后,就return一个大于0的数

这样,就能完成对数组元素的排序了。

清楚了原理,那么我们就可以想到一些高级的骚操作了

关于对象数组的排序:

// 按age升序排列var users =[        { "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 }     ]users.sort(function (a, b) {    return a.age - b.age;});// 结果(升序):/*name:has age:17 height:165name:saf age:20 height:172name:cvb age:22 height:176name:wetty age:32 height:178name:aDNY age:34 height:175name:yjerw age:42 height:156name:gngh age:45 height:182*/
// 按name排列var users =[        { "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.sort(function (a, b) {    return a.name - b.name;});// 结果:/*name:aDNY age:34 height:175name:cvb age:22 height:176name:gngh age:45 height:182name:has age:17 height:165name:saf age:20 height:172name:wetty age:32 height:178name:yjerw age:42 height:156*/
// 按布尔值排列var users=[        { "name": "has",   "age": 17, "height": 165, "state": true},        { "name": "saf",   "age": 20, "height": 172, "state": false},        { "name": "gngh",  "age": 45, "height": 182, "state": false },        { "name": "yjerw", "age": 42, "height": 156, "state": true },        { "name": "cvb",   "age": 22, "height": 176, "state": false },        { "name": "wetty", "age": 32, "height": 178, "state": true },        { "name": "aDNY",  "age": 34, "height": 175, "state": false }     ]users.sort(function (a, b) {    return b.state- a.state;});//众所周知,true - false = 1 //结果/*[  { name: 'has', age: 17, height: 165, state: true },  { name: 'yjerw', age: 42, height: 156, state: true },  { name: 'wetty', age: 32, height: 178, state: true },  { name: 'saf', age: 20, height: 172, state: false },  { name: 'gngh', age: 45, height: 182, state: false },  { name: 'cvb', age: 22, height: 176, state: false },  { name: 'aDNY', age: 34, height: 175, state: false }]*/
相关推荐