Array 原型上可用的类型
方法允许您对数组的元素进行排序,并控制如何进行排序,本文的目的是向您解释为什么,为什么不,以及类型
方法在排序一个 数组时是如何工作的。
<$>[注] TL;DR — 使用:
myArray.sort((a, b) => a - b);
<$>
由于JavaScript不是一个编写语言,JavaScript的数组可以包含不同类型的元素 - 字符串,数字,未定义等。
一个数组可以执行的许多操作之一是 分类. 无论您需要知道从分类集合中最好的学生,华尔街的大赢家,您最近消耗了多少数据,所有这些都涉及通过分类来组织一个集合。
在下面的代码示例中,我们将收集一个鸡蛋在我们的巢穴,然后将它们分类为上升和下降顺序。
填写一个 Array
我们声明和初始化一个巢
数组,并以null
值预先填写它 - 目前:
1let eggsInNest = new Array(10).fill(null);
接下来,让我们以从 1 到 200 之间的随机值填充 10 个元素:
1eggsInNest = eggsInNest.map(() => (Math.floor(Math.random() * 200) + 1));
排序
然后,我们可以简单地在我们的数组上调用种类
方法,而无需参数:
1eggsInNest.sort();
2
3// e.g.: [109, 136, 156, 188, 19, 190, 2, 34, 55, 90]
<$>[警告]正如你所看到的那样,有一个小问题,排序并不像你所期望的那样有效。
默认情况下, sort()
方法将数组分类:
- 以上升顺序
- 将项目投放到字符串
要做到这一点,‘sort’ 方法在每个数组元素上调用‘String()’ 铸造方法,然后比较相等的字符串以确定正确的顺序。
它会很容易,除了事实上,项目被比较为字符串,其中有项目被排序,仿佛它们是字符串而不是数字。简而言之,大多数时候,使用分类
方法而没有回调方法并不完全有效,因为分类
不以我们预期的方式排序。
调用函数或从技术上讲,比较函数收到两个参数(称为a
和b
)并应返回 1,如果第一个参数先于第二个参数, -1,如果第二个参数先于第一个参数,并 0,如果它们等同。
让我们创建一个‘sortEggsInNest’比较函数:
1function sortEggsInNest(a, b) {
2 if (a > b) {
3 return 1;
4 } else if (b > a) {
5 return -1;
6 } else {
7 return 0;
8 }
9}
如果你想成为一个热点,你可以将‘sortEggsInNest’比较函数缩小为一个三级运算器,如下:
1function sortEggsInNest(a, b) {
2 return a > b ? 1 : b > a ? -1 : 0;
3}
然后我们可以再次调用品种
方法,但这一次通过品种EggsInNest
比较函数:
1eggsInNest.sort(sortEggsInNest);
<$>[注] 是的,它在上升顺序下运作。
降级命令
需要以下降顺序排序吗? 只需在比较函数中的 return 1 与 return -1 交换,如下:
1function sortEggsInNest(a, b) {
2 if (a > b) {
3 return -1;;
4 } else if (b > a) {
5 return 1;;
6 } else {
7 return 0;
8 }
9}
或者,使用 ternary 操作员的简短版本:
1function sortEggsInNest(a, b) {
2 return a > b ? -1 : b > a ? 1 : 0;
3}
数字的更短路径
最后,还有一种更短的方式来写比较函数:
1eggsInNest.sort((a, b) => a - b);
<$>[警告] 这只是好,因为比较函数只返回 1, -1 或 0,并从两个中间值中提取结果是完全相同的,但请记住 - 这只能用于数字类型或对象,其 valueOf()
方法返回数值(如日期对象)。
进一步阅读
sort
是许多 Array Mutator 方法之一,以及 shift
, splice
, reverse
等。 有关所有方法的更多信息,请参阅 How To Use Array Methods in JavaScript: Mutator Methods