【JS】297-[译]正确使用 sort() 方法

点击上方“前端自习课”关注，学习起来~

英文原文：[《Usar correctamente el método sort()》]
文章地址：查看阅读原文。
注意：内容有做精简和调整。

在过去的几个星期里，我们在不同的团队中看到，一般来说都没有使用

Array.prototype.sort()

复制代码

的习惯，并且不知道这种方法是如何工作的。今天我们将尝试简要描述它是如何工作的

.sort()

复制代码

，揭示它的一些秘密。
[h2]1. 修改原数组[/h2]在这种情况下，我们必须记住，此方法通过对数组进行排序来修改数组，返回相同的有序数组，但不返回新数组。如果我们想要保持数组不可变并获得另一个排序，这一点很重要，我们必须在排序之前制作数组的拷贝。
[h2]2. 字符串在 Unicode 代码中的位置比较[/h2]默认情况下，

.sort()

复制代码

方法会根据

Unicode

复制代码

代码中每个字母的位置将数组值排序为字符串，因此您可以对此数组进行排序而不会出现问题：

1. console.log(["Zaragoza", "Madrid", "Barcelona"].sort());
复制代码
1. // [ 'Barcelona', 'Madrid', 'Zaragoza' ]
复制代码

这似乎是正确的，但是如果和一些名称以小写字母开头，那么排序似乎不正确：

1. console.log(["Zaragoza", "madrid", "Barcelona"].sort());
复制代码
1. // [ 'Barcelona', 'Zaragoza', 'madrid' ]
复制代码

在这种情况下，排序是在 Unicode 代码表中的每个字母的位置之后完成的，并且

m

复制代码

落后

Z

复制代码

，因此它已经以这种方式排序。
如果我们想对数字排序，事情就会变得复杂起来:

1. console.log([80, 9, 100].sort());
复制代码
1. // [ 100, 80, 9 ]
复制代码

结果似乎很荒谬，但这是有道理的，发生的事情是数字已被转换为字符串，因此被比较的是字符串

"100"

复制代码

，

"80"

复制代码

并且

"9"

复制代码

。由于它们在 Unicode 代码中的位置是按顺序的，因此排序是正确的，即使它不是我们最初的预期。
这些情况的产生导致一些人放弃使用

.sort()

复制代码

产生混乱的行为。这有点草率，因为只需一点帮助，这种方法可以毫无问题地运行。
[h2]3. Sort() 方法参数[/h2]该

.sort()

复制代码

有一个可选参数，允许此方法帮助对内容进行排序。这是此方法的关键，因为我们对每种情况都感兴趣。
此函数接收两个要比较的值，因此也会有这么三种情况：

如果第一个值大于第二个值，则返回正值 (
1. 1
复制代码
);
如果第一个值小于第二个值，则返回负值 (
1. -1)
复制代码
;
如果两个值相等或等效于排序，则返回零值 (
1. 0
复制代码
);

这个函数由

Javascript

复制代码

调用，只要您需要对数组中的元素进行排序，我们就可以进行必要的比较和调整。例如，为了比较数字，我们可以使用类似方法：

1. console.log([80, 9, 100].sort((a, b) => a - b));
复制代码
1. // [ 9, 80, 100 ]
复制代码

另外，

(a,b)=>a–b

复制代码

还可以这么使用：使用其中一个值

a

复制代码

去判断是否大于另一个值

b

复制代码

来返回排序结果：

1. const data = [ "Zaragoza", "madrid", "Barcelona" ];
复制代码
1. data.sort ((a, b) => a.toLowerCase () > b.toLowerCase ());
复制代码
1. console.log (data);
复制代码
1. // [ 'Zaragoza', 'madrid', 'Barcelona' ]
复制代码

显然结果不正确，因为我们草率的将函数比较的结果

true

复制代码

或者

false

复制代码

返回，我们必须记住支持函数

.sort()

复制代码

希望我们返回

-1

复制代码

，

1

复制代码

或者

0

复制代码

。为了使它正常运行，我们必须做修改：

1. const data = [ "Zaragoza", "madrid", "Barcelona" ];
复制代码
1. data.sort ((a, b) =>
复制代码
1. a.toLowerCase() > b.toLowerCase() ? 1 :
复制代码
1. a.toLowerCase()
复制代码
1. a.toLowerCase() > b.toLowerCase() ? 1 :
复制代码
1. a.toLowerCase() a.municipio.localeCompare (b.municipio));
复制代码

我们可以对数据结构中的日期和任何其他类型的对象执行相同的操作。
[h2]5. 关于性能方面[/h2]如果我们想对非常大的数组进行排序，我们必须记住。

sort()

复制代码

方法的支持函数将被多次调用，我们必须避免在这个函数中执行许多操作或非常重的操作。我们必须尽可能有效地进行比较。
例如，在非常大的数组中，可以使用新的方法

Int.Collate().compare

复制代码

来获得更有效的排序函数，而不是使用

.localecompare()

复制代码

。

Int

复制代码

对象是名为

InternationalAPI

复制代码

，也是

ECMA-402

复制代码

的标准的一部分，
该标准侧重于国际化功能，包括每种语言的正确排序。

Int

复制代码

在浏览器和节点中以全局对象的形式呈现，并具有广泛的支持(包括IE11)。

1. const data = [ "Zaragoza", "vila", "madrid", "Barcelona" ];
复制代码
1. const compare = new Intl.Collator ().compare;
复制代码
1. data.sort (compare);
复制代码
1. console.log (data);
复制代码
1. // [ 'vila', 'Barcelona', 'madrid', 'Zaragoza' ]
复制代码

排序操作很复杂，性能也很差，因此对于非常大的数组，排序方法支持函数速度的任何改进都将对性能产生非常显著的影响。
[h2]6. 总结[/h2]一般来说，我们应该利用

.sort()

复制代码

功能和一个支持函数来控制排序应该如何执行：

数字：
1. (a,b)=>a–b
复制代码
链式：
1. (a,b)=>a.localeCompare(b)
复制代码

在没有函数参数的情况下使用

.sort()

复制代码

是没有意义的，也许在少数情况下是这样，但是如果我们用一个简单的函数支持它，那么

.sort

复制代码

是一个非常有用的工具。
在许多情况下，排序是一个基本的操作，我们不应该放弃在Javascript中进行这种排序。
[h2]关于我[/h2]

本文首发在 [pingan8787个人博客] (http://www.pingan8787.com)，如需转载请保留个人介绍。

▼原创系列推荐▼1.JavaScript 重温系列（22篇全）2.ECMAScript 重温系列（10篇全）3.JavaScript设计模式重温系列（9篇全）4.正则 / 框架 / 算法等重温系列（16篇全）

你点的每个赞，我都认真当成了喜欢