JavaScript 数组排序

在 JavaScript 中，数组排序是一个常用操作，本文介绍了排序的方法，自定义排序的比较函数，获取数组中最大值最小值的不同方法，以及数组中对象元素的排序方法。

在 JavaScript 中，数组排序是一个常用操作，本文介绍了排序的方法，自定义排序的比较函数，获取数组中最大值最小值的不同方法，以及数组中对象元素的排序方法。

数组排序

sort() 方法按字母顺序对数组进行排序：

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort(); // 对数组排序
console.log(fruits); // 输出 [ "Apple", "Banana", "Mango", "Orange" ]

反转数组

reverse() 方法反转数组中的元素。

结合 reverse() 方法 与 sort() 方法可以实现按字母倒序的顺序对数组进行排序：

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort(); // 对数组排序
fruits.reverse(); // 反转数组
console.log(fruits); // 输出 [ "Orange", "Mango", "Banana", "Apple" ]

数字排序

默认情况下， sort() 将数组元素视为字符串进行排序。如果数组元素是字符串，这能很好的工作（“Apple” 排在 “Banana” 之前）。

但是，如果数组元素是数字的话，按字符串排序就会出现则 “25” 大于 “100” 的情况，因为 “2” 大于 “1”。

const points = [40, 100, 1, 5, 25, 10];
points.sort();
console.log(points); // 输出 [ 1, 10, 100, 25, 40, 5 ]

上面的例子显然不是我们需要的结果，我们需要的是按数字大小排序，而不是按照字符的进行排序。

对数字数组排序的时候，可以给 sort() 方法提供比较函数实现按照自定义排序比较策略对数组进行排序。

对数字数组进行升序排序：

const points = [40, 100, 1, 5, 25, 10];
points.sort(function (a, b) {
  return a - b;
});
console.log(points); // 输出 [ 1, 5, 10, 25, 40, 100 ]

对数字数组进行升序排序：

const points = [40, 100, 1, 5, 25, 10];
points.sort(function (a, b) {
  return b - a;
});
console.log(points); // 输出 [ 100, 40, 25, 10, 5, 1 ]

比较函数

比较函数的目的是定义排序时元素之间比较的策略。比较函数需要 2 个参数，分别表示排序过程中第一个参与比较的元素和第二个参与比较的元素。

compareFunction(a, b) {
  return a - b;
}

比较函数应返回负值、零值或正值，具体取决于排序的要求：

当 sort() 函数比较两个值时，它将值发送到比较函数，并根据返回的（负、零、正）值对比较的值进行排序。

比较函数 compareFunction(a, b) 遵循以下规则：

  • 如果比较函数 compareFunction(a, b) 返回值小于 0，那么 a 排在 b 之前。

  • 如果比较函数 compareFunction(a, b) 返回值大于 0，那么 a 排在 b 之后。

  • 如果比较函数 compareFunction(a, b) 返回值等于 0，那么 a 和 b 不排讯。

  • compareFunction(a, b) 必须总是对相同的输入返回相同的比较结果，否则排序的结果将是不确定的。

使用 sort() 方法对数组排序的时候， sort() 会在所有的元素值之间进行比较，每次比较 2 个值，直到比较完所有元素。在 2 个值之间比较的时候，会按照比较函数指定的策略进行比较。

比如：当比较 40 和 100 时， sort() 方法调用比较函数 compareFunction(40, 100)，由于 (a - b) 的结果为 40 - 100 = -60，那么 40 将排在 100 之前。

您可以使用此代码片段来试验按数字和字母顺序排序：

<button onclick="myFunction1()">按字母顺序排序</button>
<button onclick="myFunction2()">按数字大小排序</button>

<p id="demo"></p>

<script>
  const points = [40, 100, 1, 5, 25, 10];
  document.getElementById("demo").innerHTML = points;

  function myFunction1() {
    points.sort();
    document.getElementById("demo").innerHTML = points;
  }

  function myFunction2() {
    points.sort(function (a, b) {
      return a - b;
    });
    document.getElementById("demo").innerHTML = points;
  }
</script>

以随机顺序对数组进行排序

我们通过在排序方法的比较函数中返回随机的结果，来实现对对数组元素的随机排序。

const points = [40, 100, 1, 5, 25, 10];
points.sort(function (a, b) {
  return 0.5 - Math.random();
});

! Math.random() 返回一个 0 - 1 之间的随机数。

查找数组中的最大（或最小）值

数组中没有用于提供查找最大值或最小值的内置函数。

但是，在对数组进行排序后，您可以使用索引来获取最大值和最小值。

升序排序：

const points = [40, 100, 1, 5, 25, 10];
points.sort(function (a, b) {
  return a - b;
});
const max = points[points.length - 1]; // 升序排序后最后一个元素最大
const min = points[0]; // 升序排序后第一个元素最小

降序排列：

const points = [40, 100, 1, 5, 25, 10];
points.sort(function (a, b) {
  return b - a;
});
const min = points[points.length - 1]; // 升序排序后最后一个元素最小
const max = points[0]; // 升序排序后第一个元素最大

如果获得数组中的最大（或最小）值，则对整个数组进行排序是一种非常低效的方法。

在数组上使用 Math.max()

您可以使用 Math.max.apply 查找数组中的最大值：

const points = [40, 100, 1, 5, 25, 10];
const max = Math.max.apply(null, points);
console.log(max); // 输出 100

Math.max.apply(null, [1, 2, 3]) 相当于 Math.max(1, 2, 3)。

在数组上使用 Math.min()

您可以使用 Math.min.apply 查找数组中的最小值：

const points = [40, 100, 1, 5, 25, 10];
const min = Math.min.apply(null, points);
console.log(min); // 输出 1

Math.min.apply(null, [1, 2, 3]) 相当于 Math.min(1, 2, 3)。

自己实现获取数组最大(小)值的方法

自己实现一个获取数组最大(小)值的方法是很容易的。我们只需要遍历一次数组，将每个值与找到的最大（小）值比较即可。

自己实现获取数组最大值的方法：

function myArrayMax(arr) {
  let len = arr.length;
  let max = -Infinity;
  while (len--) {
    if (arr[len] > max) {
      max = arr[len];
    }
  }
  return max;
}

自己实现获取数组最小值的方法：

function myArrayMin(arr) {
  let len = arr.length;
  let min = Infinity;
  while (len--) {
    if (arr[len] < min) {
      min = arr[len];
    }
  }
  return min;
}

排序对象数组

JavaScript 数组通常包含对象：

const cars = [
  { type: "Volvo", year: 2016 },
  { type: "Saab", year: 2001 },
  { type: "BMW", year: 2010 },
];

即使对象具有不同数据类型的属性， sort() 方法也可用于对数组进行排序。

下面的例子按照年份(year)对元素进行排序：

cars.sort(function (a, b) {
  return a.year - b.year;
});

下面的例子按照类型(year)对元素进行排序：

cars.sort(function (a, b) {
  let x = a.type.toLowerCase();
  let y = b.type.toLowerCase();
  if (x < y) {
    return -1;
  }
  if (x > y) {
    return 1;
  }
  return 0;
});
JavaScript 数组方法 JavaScript 数组遍历