js中.sort()函數的用法與高級操作

今天小編給大家分享的是js中.sort()函數的用法與高級操作，相信很多人都不太了解，為了讓大家更加了解，所以給大家總結了以下內容，一起往下看吧。一定會有所收獲的哦。

這是.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: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排列
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: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
*/

// 按布爾值排列
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 }
]
*/

關于js中.sort()函數的用法與高級操作就分享到這里了，希望以上內容可以對大家有一定的參考價值，可以學以致用。如果喜歡本篇文章，不妨把它分享出去讓更多的人看到。