JS 數組方法 Array.sort()

作者：辰風沐陽閱讀：1616 發布時間：2023-02-14 上次更新：2023-02-17

[TOC]

#### 1. 情景再現
---

最近在開發一個物聯網項目時，需要對一個數據進行排序處理，這個數據結構如下所示：

需要根據 position 屬性將數組元素進行升序排序，換做是你，代碼會怎么寫？

```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 },
]
```

我的第一個想法是這樣的：先取出數組元素中的 position 屬性，然后對其進行升序排列，再查詢每一個 position 在原數組中的下標，最后構建出所需的數據結構，代碼如下所示。這種寫法顯然是比較復雜的，于是我在想有沒有更好的方法實現

```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() 方法用于數組排序，使用它一般都是不帶參數，但它是有參數的，此時說明了基礎牢固的重要性

Array.sort() 默認把數組元素先轉為 string 類型，字符串是根據 ASCII 碼進行升序排列

```javascript
// 你意料之中的結果
[5, 3, 8, 6].sort();// [3, 5, 8, 6]

// 下面的結果可能是你意料之外的
[10, 20, 1, 2].sort();// [1, 10, 2, 20]
```

幸運的是，Array.sort() 也是一個高階函數，支持傳入一個比較函數來自定義排序

傳入的函數返回值如果小于 0，前后兩個元素會交換位置

```javascript
// x 后一個元素 y 當前一個元素
[10, 20, 1, 2].sort((x, y) => x - y);// [1, 2, 10, 20]
```

回到上面的問題，對于數組元素是一個對象，根據對象中某個屬性進行排序?？梢赃@樣寫：

JS 數組方法 Array.sort()

最新發布

友情鏈接