JavaScript 数组 toSorted() 方法

JavaScript toSorted() 语法

toSorted() 是 JavaScript 数组的一个方法,它用于对数组元素进行排序(升序或降序),然后返回排序后的数组。

语法:

arr.toSorted(compareFn)

说明:

toSorted() 方法可以接收单个参数。

  • compareFn(可选):它是一个自定义函数,数组会根据这个函数来判断是升序还是降序。

如果省略了 compareFn 参数,则会执行以下步骤。

  • 将所有元素转换为字符串。
  • 使用这些字符串的 Unicode 码位值进行比较,然后按升序排列。
  • undefined 元素会被移动到数组的末尾。

如果提供了 compareFn 参数,它应该接受两个参数 a 和 b,表示要比较的两个元素。

  • 如果 compareFunction(a, b) 返回一个负数,表示 a 应该排在 b 之前。
  • 如果 compareFunction(a, b) 返回一个正数,表示 a 应该排在 b 之后。
  • 如果 compareFunction(a, b) 返回 0,表示 a 和 b 的相对位置在排序后可以保持任意顺序。

提示: toSorted() 方法和 sort() 方法的功能是一样的。只不过 sort() 是一个 “破坏性” 方法,它会修改原数组。而 toSorted() 是一个 “非破坏性” 方法,它不会修改原数组。

JavaScript toSorted() 摘要

属于 JavaScript Array 对象
使用频率
修改原数组
官方文档 查看
MDN 查看

JavaScript toSorted() 示例

接下来,我们通过几个简单的例子来讲解一下 JavaScript toSorted() 方法是如何使用的。

示例 1:toSorted() 实现升序

function fn (a, b) {
    return a - b;
}
const arr = [3, 9, 1, 12, 50, 21];
const result = arr.toSorted(fn);

console.log(arr);
console.log(result);

运行结果如下。

[ 3, 9, 1, 12, 50, 21 ]
[ 1, 3, 9, 12, 21, 50 ]

分析:

从结果可以看出来,toSorted() 方法不会修改原数组,而是返回一个新数组。

示例 2:toSorted() 实现降序

function fn (a, b) {
    return b - a;
}
const arr = [3, 9, 1, 12, 50, 21];
const result = arr.toSorted(fn);

console.log(arr);
console.log(result);

运行结果如下。

[ 3, 9, 1, 12, 50, 21 ]
[ 50, 21, 12, 9, 3, 1 ]

示例 3:toSorted() 不带参数

const arr = [3, 9, 1, 12, 50, 21];
const result = arr.toSorted();

console.log(arr);
console.log(result);

运行结果如下。

[ 3, 9, 1, 12, 50, 21 ]
[ 1, 12, 21, 3, 50, 9 ]

分析:

所有元素在排序之前都会转换为字符串,然后再按升序排列。这里可以看到,即使 21 在数字上大于 3,但 3 也排在 21 的后面,这是因为 "2" < "3"。

“破坏性” 方法 vs “非破坏性” 方法

在 JavaScript 中,数组的 “破坏性” 方法以及它们对应的 “非破坏性” 方法,总结如下表所示。

破坏性方法 vs 非破坏性方法
破坏性 非破坏性 说明
reverse() toReversed() 反转数组
sort() toSorted() 数组排序
splice() toSpliced() 修改数组(添加、删除或替换元素)
arr[i] = val(索引赋值) with() 替换数组某个元素

上一篇: toReversed()

下一篇: toSpliced()

给站长反馈

绿叶网正在不断完善中,小伙伴们如果发现任何问题,还望多多给站长反馈,谢谢!

邮箱:lvyenet@vip.qq.com

「绿叶网」服务号
绿叶网服务号放大
关注服务号,微信也能看教程。
绿叶网服务号