跳到主要内容

JavaScript 数组 sort() 方法

sort() 方法用于按照特定顺序（升序或降序）对数组的项进行排序。

示例​

let city = ["加利福尼亚", "巴塞罗那", "巴黎", "加德满都"];

// 按升序对城市数组进行排序
let sortedArray = city.sort();
console.log(sortedArray);

// 输出结果: [ '巴塞罗那', '加利福尼亚', '加德满都', '巴黎' ]

sort() 语法​

sort() 方法的语法如下：

arr.sort(compareFunction);

这里，arr 是一个数组。

sort() 参数​

sort() 方法接受以下参数：

  • compareFunction（可选） - 用于定义自定义排序顺序。

sort() 返回值​

  • 返回在原地排序数组后的数组（这意味着它会改变原始数组，而不创建副本）。

示例 1：对数组元素进行排序​

当未传递 compareFunction 时，

  • 所有非undefined数组元素首先被转换为字符串。
  • 然后，使用它们的 UTF-16 代码点值进行比较。
  • 按升序排序。
  • 所有undefined元素被排序到数组的末尾。
// 对字符串数组进行排序
var names = ["亚当", "杰弗里", "法比亚诺", "丹尼尔", "本"];

// 返回已排序的数组
console.log(names.sort());

// 修改原始数组
console.log(names);

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

// 数字转换为字符串并排序
console.log(priceList);

输出结果

["亚当", "本", "丹尼尔", "法比亚诺", "杰弗里"][
  ("亚当", "本", "丹尼尔", "法比亚诺", "杰弗里")
][(1000, 14, 2, 50, 7)];

JavaScript 数组排序（sort() 方法）

在这里，我们可以看到名称数组按照字符串的升序排列。例如，"Adam" 出现在 "Danil" 之前，因为 "A" 出现在 "D" 之前。

由于在对它们进行排序之前，所有非undefined元素都会被转换为字符串，所以Number数据类型按照这个顺序排序。

在这里，我们可以看到即使 1000 在数值上大于 50，它也出现在排序列表的开头。这是因为 "1" < "5"。

示例 2：使用自定义函数排序​

当传递 compareFunction 时，

  • 所有非undefined数组元素根据 compareFunction 的返回值进行排序。
  • 所有未定义的元素将被排序到数组的末尾，不会为它们调用 compareFunction。

假设我们想对上面的名称数组进行排序，以使最长的名称出现在最后，而不是按字母顺序排序。我们可以按以下方式执行：

// 自定义排序字符串数组
var names = ["Adam", "Jeffrey", "Fabiano", "Danil", "Ben"];

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

// 根据字符串长度排序
names.sort(len_compare);

console.log(names);

输出结果

["Ben", "Adam", "Danil", "Jeffrey", "Fabiano"];

在这里，排序基于逻辑 a.length - b.length。它基本上意味着长度较短的项目将出现在 Array 的开头。

让我们首先了解可选的 compareFunction 是如何工作的。

任何 compareFunction 都具有以下语法：

function (a, b){
 // 排序逻辑
 // 返回一个数字
}

sort() 方法将数组的所有值进行比较，一次传递两个值给 compareFunction。两个参数 a 和 b 分别表示这两个值。

compareFunction 应返回一个数字。这个返回值用于按以下方式对元素进行排序：

  • 如果 返回值 < 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：按数字进行数值排序​

由于在对它们进行排序之前，所有非undefined元素都会被转换为字符串，因此我们不能使用它们的数值来按数值值进行排序。

让我们看看如何使用自定义函数实现这一点。

// 数值排序

// 定义数组
var priceList = [1000, 50, 2, 7, 14];

// 使用函数表达式进行排序（升序）
priceList.sort(function (a, b) {
  return a - b;
});

// 输出结果：升序 - 2,7,14,50,1000
console.log("升序 - " + priceList);

// 使用箭头函数表达式进行排序（降序）
priceList.sort((a, b) => b - a);

// 输出结果：降序 - 1000,50,14,7,2
console.log("降序 - " + priceList);

输出结果

升序 - 2, 7, 14, 50, 1000;
降序 - 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 数组 reverse()。

最后于 更新