[TOC] #### 1. 情景再現(xiàn) --- 最近在開發(fā)一個物聯(lián)網項目時，需要對一個數(shù)據(jù)進行排序處理，這個數(shù)據(jù)結構如下所示： 需要根據(jù) position 屬性將數(shù)組元素進行升序排序，換做是你，代碼會怎么寫？ ```javascript const data = [ { id: 1, name: 'maria', position: 17 }, { id: 2, name: 'liang', position: 18 }, { id: 3, name: 'monday', position: 16 }, { id: 4, name: 'monday', position: 15 }, { id: 5, name: 'monday', position: 19 }, ] ``` 我的第一個想法是這樣的：先取出數(shù)組元素中的 position 屬性，然后對其進行升序排列，再查詢每一個 position 在原數(shù)組中的下標，最后構建出所需的數(shù)據(jù)結構，代碼如下所示。這種寫法顯然是比較復雜的，于是我在想有沒有更好的方法實現(xiàn) ```javascript const arr = data.map(({ position }) => position) arr.sort() const newArr = arr.map(val => { return data.findIndex((item, index) => item.position == val) }).map(item => data[item]) ``` #### 2. Array.sort() --- 眾所周知，Array.sort() 方法用于數(shù)組排序，使用它一般都是不帶參數(shù)，但它是有參數(shù)的，此時說明了基礎牢固的重要性 Array.sort() 默認把數(shù)組元素先轉為 string 類型，字符串是根據(jù) ASCII 碼進行升序排列 ```javascript // 你意料之中的結果 [5, 3, 8, 6].sort();// [3, 5, 8, 6] // 下面的結果可能是你意料之外的 [10, 20, 1, 2].sort();// [1, 10, 2, 20] ``` 幸運的是，Array.sort() 也是一個高階函數(shù)，支持傳入一個比較函數(shù)來自定義排序 傳入的函數(shù)返回值如果小于 0，前后兩個元素會交換位置 ```javascript // x 后一個元素 y 當前一個元素 [10, 20, 1, 2].sort((x, y) => x - y);// [1, 2, 10, 20] ``` 回到上面的問題，對于數(shù)組元素是一個對象，根據(jù)對象中某個屬性進行排序?？梢赃@樣寫： ```javascript const data = [ { id: 1, name: 'maria', position: 17 }, { id: 2, name: 'liang', position: 18 }, { id: 3, name: 'monday', position: 16 }, { id: 4, name: 'monday', position: 15 }, { id: 5, name: 'monday', position: 19 }, ] // 代碼非常簡潔易懂 data.sort((x, y) => x.position - y.position) ```