摘要：方法参数该有一个可选参数，允许此方法帮助对内容进行排序。例如，在非常大的数组中，可以使用新的方法来获得更有效的排序函数，而不是使用。在浏览器和节点中以全局对象的形式呈现，并具有广泛的支持包括。
英文原文： 《Usar correctamente el método sort()》
注意：内容有做精简和调整。
在过去的几个星期里，我们在不同的团队中看到，一般来说都没有使用 Array.prototype.sort() 的习惯，并且不知道这种方法是如何工作的。今天我们将尝试简要描述它是如何工作的 .sort()，揭示它的一些秘密。
1. 修改原数组在这种情况下，我们必须记住，此方法通过对数组进行排序来修改数组，返回相同的有序数组，但不返回新数组。如果我们想要保持数组不可变并获得另一个排序，这一点很重要，我们必须在排序之前制作数组的拷贝。
2. 字符串在 Unicode 代码中的位置比较默认情况下，.sort() 方法会根据 Unicode 代码中每个字母的位置将数组值排序为字符串，因此您可以对此数组进行排序而不会出现问题：
console.log(["Zaragoza", "Madrid", "Barcelona"].sort()); // [ "Barcelona", "Madrid", "Zaragoza" ]
这似乎是正确的，但是如果和一些名称以小写字母开头，那么排序似乎不正确：
console.log(["Zaragoza", "madrid", "Barcelona"].sort()); // [ "Barcelona", "Zaragoza", "madrid" ]
在这种情况下，排序是在 Unicode 代码表中的每个字母的位置之后完成的，并且 m 落后 Z ，因此它已经以这种方式排序。
如果我们想对数字排序，事情就会变得复杂起来:
console.log([80, 9, 100].sort()); // [ 100, 80, 9 ]
结果似乎很荒谬，但这是有道理的，发生的事情是数字已被转换为字符串，因此被比较的是字符串"100"，"80"并且"9"。由于它们在 Unicode 代码中的位置是按顺序的，因此排序是正确的，即使它不是我们最初的预期。
这些情况的产生导致一些人放弃使用 .sort() 产生混乱的行为。这有点草率，因为只需一点帮助，这种方法可以毫无问题地运行。
3. Sort() 方法参数该 .sort() 有一个可选参数，允许此方法帮助对内容进行排序。这是此方法的关键，因为我们对每种情况都感兴趣。
此函数接收两个要比较的值，因此也会有这么三种情况：
如果第一个值大于第二个值，则返回正值 (1);
如果第一个值小于第二个值，则返回负值 (-1);
如果两个值相等或等效于排序，则返回零值 (0);
这个函数由 Javascript 调用，只要您需要对数组中的元素进行排序，我们就可以进行必要的比较和调整。例如，为了比较数字，我们可以使用类似方法：
console.log([80, 9, 100].sort((a, b) => a - b)); // [ 9, 80, 100 ]
另外，(a, b) => a – b 还可以这么使用：使用其中一个值 a 去判断是否大于另一个值 b 来返回排序结果：
const data = [ "Zaragoza", "madrid", "Barcelona" ]; data.sort ((a, b) => a.toLowerCase () > b.toLowerCase ()); console.log (data); // [ "Zaragoza", "madrid", "Barcelona" ]
显然结果不正确，因为我们草率的将函数比较的结果 true 或者 false 返回，我们必须记住支持函数 .sort() 希望我们返回 -1 ， 1 或者 0。为了使它正常运行，我们必须做修改：
const data = [ "Zaragoza", "madrid", "Barcelona" ]; data.sort ((a, b) => a.toLowerCase() > b.toLowerCase() ? 1 : a.toLowerCase() < b.toLowerCase() ? -1: 0 ); console.log (data); // [ "Barcelona", "madrid", "Zaragoza" ]
现在的结果是我们需要的，因为我们已经对小写和大写也进行了比较，并且我们已经返回-1，1或者0根据每种情况。
我们还没有真正完成，因为如果我们加入一些重音字母，我们会得到一个不希望的结果：
const data = [ "Zaragoza", "madrid", "Barcelona", "Ávila" ]; data.sort ((a, b) => a.toLowerCase() > b.toLowerCase() ? 1 : a.toLowerCase() < b.toLowerCase() ? -1: 0 ); console.log (data); // [ "Barcelona", "madrid", "Zaragoza", "Ávila" ]
当我们想对文本字符串进行排序，就非常有必要使用 .localeCompare() 方法，也是非常重要。
4. 用对象属性排序数组通常，如果数组包含对象，我们可以使用对象的属性进行比较，例如：
const data = require ("./municipios.json");
data.sort ((a, b) => a.municipio.localeCompare (b.municipio));
我们可以对数据结构中的日期和任何其他类型的对象执行相同的操作。
5. 关于性能方面如果我们想对非常大的数组进行排序，我们必须记住。sort() 方法的支持函数将被多次调用，我们必须避免在这个函数中执行许多操作或非常重的操作。我们必须尽可能有效地进行比较。
例如，在非常大的数组中，可以使用新的方法 Int.Collate().compare 来获得更有效的排序函数，而不是使用 .localecompare()。Int 对象是名为 International API ，也是 ECMA-402 的标准的一部分，
该标准侧重于国际化功能，包括每种语言的正确排序。Int 在浏览器和节点中以全局对象的形式呈现，并具有广泛的支持(包括IE11)。
const data = [ "Zaragoza", "Ávila", "madrid", "Barcelona" ]; const compare = new Intl.Collator ().compare; data.sort (compare); console.log (data); // [ "Ávila", "Barcelona", "madrid", "Zaragoza" ]
排序操作很复杂，性能也很差，因此对于非常大的数组，排序方法支持函数速度的任何改进都将对性能产生非常显著的影响。
6. 总结一般来说，我们应该利用 .sort() 功能和一个支持函数来控制排序应该如何执行：
数字： (a, b) => a – b
链式： (a, b) => a.localeCompare(b)
在没有函数参数的情况下使用 .sort() 是没有意义的，也许在少数情况下是这样，但是如果我们用一个简单的函数支持它，那么 .sort 是一个非常有用的工具。
在许多情况下，排序是一个基本的操作，我们不应该放弃在Javascript中进行这种排序。
关于我本文首发在 pingan8787个人博客，如需转载请保留个人介绍。
| Author | 王平安 |
|---|---|
| pingan8787@qq.com | |
| 博 客 | www.pingan8787.com |
| 微 信 | pingan8787 |
| 每日文章推荐 | https://github.com/pingan8787... |
| ES小册 | js.pingan8787.com |
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/105975.html
摘要：它并不是实际在内部的工作方式，而且它只是一个提案，在未来都会有可能发生变化。这意味着，数据的存储是独立于组件之外的。因此，有一个诀窍就是你需要思考作为一组需要一个匹配一致的指针去管理的数组染陌译。 原文地址：https://medium.com/@ryardley/... 译文：染陌 （Github） 译文地址：https://github.com/answershuto/Blog 转...
摘要：需求给出定两个参数，参数，参数查找参数插入数组时的最小索引思路数组重排序判断数组中是否包含的最小数，有，则返回其最小数的索引无，则返回其数组长度思路用变量存储大于中各元素的次数返回变量思路数组重排序查找大于的数组最小值的索引索引等于返 需求 给出定两个参数，参数1：arr，参数2：num；查找参数num插入数组时的最小索引 getIndexToIns([10, 20, 30, 40, ...
摘要：前言又称提供一个全新的迭代器的概念，它允许我们在语言层面上定义一个有限或无限的序列。后者可以被用来帮助我们理解迭代器。但是当我们使用迭代器时，这个问题就迎刃而解了。是中的新语法，用来配合迭代器。这是因为数组的迭代器只返回其中预期的元素。 前言 EcmaScript 2015 （又称ES6）提供一个全新的迭代器的概念，它允许我们在语言层面上定义一个（有限或无限的）序列。 暂时先抛开它...
摘要：如果你使用实验性属性初始化语法，你能用这方法来正确绑定回调函数的绑定这语法在中默认支持。然而，如果这回调函数是作为一个传递到更下一级的组件中的时候，些组件可能会做一个额外的重新渲染。 下面是react官方文档的个人翻译，如有翻译错误，请多多指出原文地址：https://facebook.github.io/re... Handling events with React element...
阅读 1608·2021-11-23 10:07
阅读 2603·2019-08-30 11:10
阅读 2819·2019-08-29 17:08
阅读 1757·2019-08-29 15:42
阅读 3128·2019-08-29 12:57
阅读 2379·2019-08-28 18:06
阅读 3508·2019-08-27 10:56
阅读 363·2019-08-26 11:33
