数组是 JavaScript 中常用的数据结构之一，而 sort() 函数是其中常用的方法之一，通常用于对数组元素进行排序。ES10 带来了一些新特性，其中包括 Array.prototype.sort() 函数的改进，本文将深入探讨这个新特性。
旧版 sort() 函数
在介绍新版 Array.prototype.sort() 函数前，我们先来看一下旧版的 sort() 函数。该函数接收一个比较函数作为参数，用于比较两个元素的大小，根据指定的排序顺序返回一个数组。
下面是一个基本的 sort() 函数的示例代码：
const arr = [3, 1, 4, 2, 7, 5, 6]; arr.sort((a, b) => a - b); // 数组按从小到大的顺序排列 console.log(arr); // [1, 2, 3, 4, 5, 6, 7]
在这段代码中，我们定义了一个数组 arr，然后用 sort() 函数对其进行排序。比较函数返回 a - b 的结果，表示从小到大的顺序。在这种比较函数中，如果返回值小于 0，则 a 会排在 b 前面，大于 0 则 b 会排在 a 前面，等于 0 则两个数相等。
sort() 函数会改变原有的数组，不会返回一个新的数组。
新版 sort() 函数
在 ES10 中，Array.prototype.sort() 函数的改进在于，它现在支持稳定排序。这意味着，如果两个元素相等，它们在排序后仍然按照原有的顺序排列。
在旧版 sort() 函数中，如果两个元素相等，则无法保证它们在排序后的顺序。例如，使用旧版的 sort() 函数对以下数组进行排序：
const arr = [
{ name: 'John', age: 25 },
{ name: 'Sarah', age: 35 },
{ name: 'Peter', age: 25 }
];
arr.sort((a, b) => {
return a.age - b.age;
});在这个例子中，元素 { name: 'John', age: 25 } 和 { name: 'Peter', age: 25 } 年龄相同，如果按照比较函数中的规则排序，它们的位置可能会发生变化。这可能会导致业务逻辑的问题。
在 ES10 中，我们可以通过指定一个新的排序函数，使 sort() 函数支持稳定排序。新的比较函数带有两个参数，第一个参数是待比较的元素，第二个参数是该元素在数组中的索引。
下面是一个基本的稳定排序函数的示例代码：
-- -------------------- ---- -------
----- --- - -
- ----- ------- ---- -- --
- ----- -------- ---- -- --
- ----- -------- ---- -- -
--
------------ -- -- -
-- ------ --- ------ -
------ -------------- - ---------------
- ---- -
------ ----- - ------
-
---在这个比较函数中，我们首先比较两个元素的年龄。如果它们的年龄相同，我们使用 indexOf() 函数获取它们在数组中的索引，并比较这两个索引的大小。如果它们的年龄不同，则按照传统方式比较它们的大小。
总结
ES10 中的 Array.prototype.sort() 函数的改进为 JavaScript 面向对象编程中的数组操作提供了更好的支持，使排序更加准确、方便和直观。我们可以使用新的稳定排序函数来更好地处理在排序时可能出现的业务逻辑问题。这个新特性不仅可以帮助开发人员节省时间和代码，也可以提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64558aac968c7c53b0906f1d