【JS】sort() 对数组元素进行排序

1 sort 作用

sort() 方法用于对数组的元素进行排序，并返回数组。

默认排序顺序是在将元素转换为字符串，然后比较它们的 UTF-16 代码单元值构建时的点位序列。

2 尝试一下

const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months); // ["Dec", "Feb", "Jan", "March"]

const arr = [1, 30, 4, 21, 100000];
arr.sort();
console.log(arr); // [1, 100000, 21, 30, 4]
1
2
3
4
5
6
7

3 语法&参数&返回值

3.1 语法

一般是传入一个比较函数比较方便，代码可读性高。

// 无函数
sort()

// 箭头函数
sort((a, b) => { /* … */ } )

// 比较函数
sort(compareFn)

// 内联比较函数
sort(function compareFn(a, b) { /* … */ })
1
2
3
4
5
6
7
8
9
10
11

3.2 参数

compareFn 用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的各个字符的 Unicode 位点进行排序。

a 第一个用于比较的元素

b 第二个用于比较的元素

3.3 返回值

排序后的数组，即 会改变的原数组。

4 描述与示例

如果没有指明 compareFn ，那么元素会按照转换为的字符串的诸个字符的 Unicode 点位进行排序。

例如 “Banana” 会被排列到 “cherry” 之前。

当数字按由小到大排序时，9 出现在 80 之前，但因为（没有指明 compareFn），比较的数字会先被转换为字符串，所以在 Unicode 顺序上 “80” 要比 “9” 要靠前。

如果指明了 compareFn ，那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素：

• 如果 compareFn(a, b) 大于 0 ， b 会被排列到 a 之前。
• 如果 compareFn(a, b) 小于 0 ，那么 a 会被排列到 b 之前；
• 如果 compareFn(a, b) 等于 0 ， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）；
• compareFn(a, b) 必须总是对相同的输入返回相同的比较结果，否则排序的结果将是不确定的。

4.1 比较函数 格式如下

function compareFn(a, b) {
  if (在某些排序规则中，a 小于 b) {
    return -1;
  }
  if (在这一排序规则下，a 大于 b) {
    return 1;
  }
  // a 一定等于 b
  return 0;
}

1
2
3
4
5
6
7
8
9
10
11

要比较数字而非字符串，比较函数可以简单的用 a 减 b，如下的函数将会将数组升序排列（如果它不包含 Infinity 和 NaN）：

function compareNumbers(a, b) {
  return a - b;
}
1
2
3

4.2 函数表达式也方便

const numbers = [4, 2, 5, 1, 3];
numbers.sort(function (a, b) {
  return a - b;
});
console.log(numbers); // [1, 2, 3, 4, 5]
1
2
3
4
5

const numbers2 = [4, 2, 5, 1, 3];
numbers2.sort((a, b) => a - b);
console.log(numbers2); // [1, 2, 3, 4, 5]
1
2
3

5 对象可以按照某个属性顺序排序

示例：

const items = [
  { name: 'Edward', value: 21 },
  { name: 'Sharpe', value: 37 },
  { name: 'And', value: 45 },
  { name: 'The', value: -12 },
  { name: 'Magnetic', value: 13 },
  { name: 'Zeros', value: 37 }
];

//按 value 排序
items.sort((a, b) => a.value - b.value);

//按 name 排序
items.sort((a, b) => {
  const nameA = a.name.toUpperCase(); // 不区分大小写
  const nameB = b.name.toUpperCase(); // 不区分大小写
  if (nameA < nameB) {
    return -1;
  }
  if (nameA > nameB) {
    return 1;
  }

  // name 必须相等
  return 0;
});

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27