数组去重：你还不知道的技巧

2024-01-26 09:07:19

在JavaScript中，数组去重是一个常见的问题。有许多方法可以实现数组去重，每种方法都有其优缺点。本文将介绍五种常见的数组去重技巧，并比较它们的性能和适用性。

1. 利用ES6中的Set方法去重

ES6中的Set数据结构可以自动去除重复元素，因此我们可以利用Set来实现数组去重。具体步骤如下：

const arr = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法的优点是简单易用，并且不需要考虑数组的顺序。但是，Set数据结构并不支持索引，因此如果需要保留数组的顺序，则需要使用其他方法。

2. 利用数组indexOf方法去重

数组的indexOf方法可以返回某个元素在数组中首次出现的位置，我们可以利用这个特性来实现数组去重。具体步骤如下：

const arr = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
  if (uniqueArr.indexOf(arr[i]) === -1) {
    uniqueArr.push(arr[i]);
  }
}
console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法的优点是简单易懂，并且可以保留数组的顺序。但是，这种方法的时间复杂度为O(n^2)，当数组很大时，性能可能会比较差。

3. 利用数组reduce方法去重

数组的reduce方法可以将数组中的元素逐个累积，并最终返回一个值。我们可以利用reduce方法来实现数组去重。具体步骤如下：

const arr = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr = arr.reduce((result, item) => {
  if (!result.includes(item)) {
    result.push(item);
  }
  return result;
}, []);
console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法的优点是简单易懂，并且可以保留数组的顺序。但是，这种方法的时间复杂度为O(n^2)，当数组很大时，性能可能会比较差。

4. 利用数组filter方法去重

数组的filter方法可以过滤出数组中满足某个条件的元素，我们可以利用这个特性来实现数组去重。具体步骤如下：

const arr = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr = arr.filter((item, index) => {
  return arr.indexOf(item) === index;
});
console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法的优点是简单易懂，并且可以保留数组的顺序。但是，这种方法的时间复杂度为O(n^2)，当数组很大时，性能可能会比较差。

5. 利用数组slice方法去重

数组的slice方法可以从数组中截取一段元素，我们可以利用这个特性来实现数组去重。具体步骤如下：

const arr = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
  if (uniqueArr.indexOf(arr[i]) === -1) {
    uniqueArr = uniqueArr.concat(arr.slice(i, i + 1));
  }
}
console.log(uniqueArr); // [1, 2, 3, 4, 5]