ECMAScript 2019 的 Array.sort()，彻底理解数组排序的 “奇技淫巧”

前言

在前端开发中，我们经常需要对数组进行排序。而在 ECMAScript 2019 中，Array.sort() 方法进行了一些改进，提供了更多的排序选项，使得数组排序更加灵活和方便。本文将详细介绍 ECMAScript 2019 中 Array.sort() 方法的新特性，以及如何使用这些特性实现各种排序需求。

基本用法

首先，我们来回顾一下 Array.sort() 方法的基本用法。该方法的作用是将数组中的元素进行排序。默认情况下，它会将数组元素转换为字符串，然后按照 Unicode 字符顺序进行排序。

例如，我们有一个数组：

const arr = [5, 2, 1, 4, 3];

我们可以调用 Array.sort() 方法对该数组进行排序：

arr.sort();
console.log(arr); // [1, 2, 3, 4, 5]

自定义排序规则

如果我们需要按照自定义的规则对数组进行排序，可以传入一个比较函数作为参数。该函数接受两个参数，表示要比较的两个元素，返回值为一个数字，表示它们的相对顺序。

例如，我们有一个字符串数组，需要按照字符串长度进行排序：

const arr = ['apple', 'orange', 'banana', 'pear'];
arr.sort((a, b) => a.length - b.length);
console.log(arr); // ['pear', 'apple', 'orange', 'banana']

这里我们传入了一个比较函数，它将两个字符串的长度进行比较，返回它们的长度差，从而实现按照字符串长度进行排序。

稳定排序

在 ECMAScript 2019 中，Array.sort() 方法支持稳定排序。所谓稳定排序，是指排序后相等的元素的相对顺序不会改变。这在某些应用场景下非常重要，比如在对表格进行排序时，我们希望相同的值按照原来的顺序排列。

要实现稳定排序，我们需要传入一个比较函数，并且在比较相等的元素时，返回它们在原数组中的相对顺序。

例如，我们有一个包含重复元素的数组：

const arr = [
  { name: 'apple', price: 2 },
  { name: 'orange', price: 1 },
  { name: 'banana', price: 2 },
  { name: 'pear', price: 3 },
  { name: 'peach', price: 2 }
];

我们希望按照价格进行排序，但是相同价格的元素需要按照它们在原数组中的顺序排列。我们可以这样实现：

arr.sort((a, b) => {
  if (a.price === b.price) {
    return arr.indexOf(a) - arr.indexOf(b);
  }
  return a.price - b.price;
});
console.log(arr);

这里我们在比较相等的元素时，使用了 indexOf() 方法获取它们在原数组中的位置，从而保证它们的相对顺序不变。

支持 BigInt 类型

在 ECMAScript 2019 中，Array.sort() 方法开始支持 BigInt 类型。这意味着我们可以对包含 BigInt 类型的数组进行排序了。

例如，我们有一个包含 BigInt 类型的数组：

const arr = [10n, 5n, 2n, 7n];

我们可以直接使用 Array.sort() 方法对它进行排序：

arr.sort();
console.log(arr); // [2n, 5n, 7n, 10n]

结语

通过本文的介绍，我们可以看到 ECMAScript 2019 中 Array.sort() 方法的新特性，以及如何使用这些特性实现各种排序需求。希望本文对大家理解数组排序有所帮助。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6788d1df09307066475081f8