JavaScript Array sort()用法及代碼示例

let city = ["California", "Barcelona", "Paris", "Kathmandu"];

// sort the city array in ascending order
let sortedArray = city.sort();
console.log(sortedArray);

// Output: [ 'Barcelona', 'California', 'Kathmandu', 'Paris' ]

sort() 語法

用法:

arr.sort(compareFunction)

這裏，arr 是一個數組。

參數：

sort() 方法包含：

• compareFunction(可選) - 用於定義自定義排序順序。

返回：

• 在對數組元素進行適當排序後返回數組(這意味著它會更改原始數組並且不進行複製)。

示例 1：對數組的元素進行排序

當compareFunction沒有通過時，

• 所有非undefined 數組元素首先轉換為字符串。
• 然後使用它們的 UTF-16 代碼點值比較這些字符串。
• 排序按升序進行。
• 所有undefined 元素都排序到數組的末尾。

// sorting an array of strings
var names = ["Adam", "Jeffrey", "Fabiano", "Danil", "Ben"];

// returns the sorted array
console.log(names.sort());

// modifies the array in place
console.log(names);

var priceList = [1000, 50, 2, 7, 14];
priceList.sort();

// Number is converted to string and sorted
console.log(priceList)

輸出

[ 'Adam', 'Ben', 'Danil', 'Fabiano', 'Jeffrey' ]
[ 'Adam', 'Ben', 'Danil', 'Fabiano', 'Jeffrey' ]
[ 1000, 14, 2, 50, 7 ]

在這裏，我們可以看到names數組按字符串的升序排序。例如，亞當來之前丹尼爾因為"A"來之前"D".

由於所有未定義的元素在排序之前都轉換為字符串，因此 Number 數據類型按該順序排序。

在這裏，我們可以看到，即使 1000 在數字上大於 50，它也出現在排序列表的開頭。這是因為"1" < "5"。

示例 2：使用自定義函數排序

當compareFunction通過時，

• 所有非 undefined 數組元素根據 compareFunction 的返回值排序。
• 所有未定義的元素都排序到數組的末尾，並且不為它們調用compareFunction。

假設我們要對上麵的names 數組進行排序，使得最長的名稱排在最後，而不是按字母順序排序。我們可以通過以下方式做到這一點：

// custom sorting an array of strings
var names = ["Adam", "Jeffrey", "Fabiano", "Danil", "Ben"];

function len_compare(a, b){
    return a.length - b.length;
}

// sort according to string length
names.sort(len_compare);

console.log(names);

輸出

[ 'Ben', 'Adam', 'Danil', 'Jeffrey', 'Fabiano' ]

在這裏，排序基於邏輯 a.length - b.length 。這本質上意味著長度較短的項目將出現在 Array 的開頭。

讓我們首先了解可選的compareFunction 是如何工作的。

任何 compareFunction 都具有以下語法：

function (a, b){
    // sorting logic
    // return a Number 
}

sort() 方法通過一次將兩個值傳遞給 compareFunction 來比較數組的所有值。 a和b這兩個參數分別代表這兩個值。

compareFunction 應該返回一個 Number 。此返回值用於按以下方式對元素進行排序：

• 如果返回值 < 0,a排在前麵b(a來之前b)。
• 如果返回值 > 0,b排在前麵a(b來之前a)。
• 如果返回值 == 0,a和b相對於彼此保持不變。

在示例 2 中，我們使用以下命令對數組進行排序：

function len_compare(a, b){
    return a.length - b.length;
}

這裏：

• 如果a.length - b.length < 0,a來之前b.例如，"Adam"來之前"Jeffrey"作為4 - 7 < 0.
• 如果a.length - b.length > 0,b來之前a.例如，"Danil"緊接著"Ben"作為5 - 3 > 0。
• 如果a.length - b.length == 0，他們的位置不變。例如，相對位置"Jeffrey"和"Fabiano"不變，因為7 - 7 == 0.

我們可以看到，這導致根據字符串的長度升序對字符串進行排序。

示例 3：對數字進行數字排序

由於所有未定義的元素在對它們進行排序之前都會轉換為字符串，因此默認情況下我們不能使用它們的數值對數字進行排序。

讓我們看看如何使用自定義函數來實現它。

// numeric sorting

// define array
var priceList = [1000, 50, 2, 7, 14];

// sort() using function expression
// ascending order
priceList.sort(function (a, b) {
  return a - b;
});

// Output: Ascending - 2,7,14,50,1000
console.log("Ascending - " + priceList);

// sort() using arrow function expression
// descending order
priceList.sort((a, b) => b - a);

// Output: Descending - 1000,50,14,7,2
console.log("Descending - " + priceList);

輸出

Ascending - 2,7,14,50,1000
Descending - 1000,50,14,7,2

在此示例中，我們使用以下方法對數組進行排序：

function (a, b) {
  return a - b;
}

這裏，

• 如果a - b < 0,a來之前b.例如，2來之前7作為2 - 7 < 0.
• 如果a - b > 0,b來之前a.例如，1000緊接著50作為1000 - 50 > 0。

我們可以看到，這導致根據數字的升序對數字進行排序。

同樣，我們可以使用b - a 對它們進行降序排序。注意，我們也可以使用 ES2015 中定義的箭頭函數表達式。

我們還可以使用內置數組reverse() 方法反轉(降序)排序數組。要了解更多信息，請訪問JavaScript Array reverse()。