巧用JS净化浑浊水源：Array去重术

前端

2024-02-01 08:49:37

01 踏上JavaScript数组去重的征途

在编程世界中，数组是存储和操作数据的基本结构之一。然而，在实际应用中，我们经常会遇到数组中存在重复元素的情况，这不仅会浪费内存空间，还会影响数据的准确性和可靠性。因此，掌握数组的去重技巧就显得尤为重要。

02 剖析JavaScript数组去重的奥秘

实现数组去重的方案可谓是五花八门，每种方法都有其独特的优势和适用场景。以下我们将逐一分析几种最常用的去重方法，帮助您全面了解其原理和应用。

02.01 嵌套循环：朴素而直接

嵌套循环是一种最直观、最容易理解的去重方法。其基本思想是：通过两个嵌套循环比较数组中的每个元素，如果发现重复项，则将其删除。这种方法虽然简单，但时间复杂度为O(n^2)，效率较低，因此不适用于处理大型数组。

02.02 Set：集合的天然去重特性

Set数据结构的天然特性之一就是自动去重。我们可以将数组元素逐个添加到Set中，当遇到重复元素时，Set会自动将其忽略。最后，再将Set中的元素转为数组即可。这种方法的时间复杂度为O(n)，效率远高于嵌套循环，但它要求数组元素的数据类型必须是基本类型或不可变对象。

02.03 Array.prototype.filter()：灵活的过滤利器

Array.prototype.filter()方法可以根据指定的过滤函数对数组进行过滤，返回一个包含所有满足该过滤条件的元素的新数组。我们可以利用此方法实现数组去重，具体做法是：将数组元素作为参数传入过滤函数，如果元素在数组中出现过，则过滤掉，否则保留。这种方法的时间复杂度为O(n)，效率与Set方法相当，但它对数组元素的数据类型没有限制。

02.04 Array.prototype.indexOf()：巧用索引查找重复项

Array.prototype.indexOf()方法可以返回指定元素在数组中的索引位置。我们可以利用此方法实现数组去重，具体做法是：遍历数组中的每个元素，如果元素在数组中出现过，则使用indexOf()方法将其索引位置记录下来，并在后续遍历中跳过该索引位置的元素。这种方法的时间复杂度为O(n^2)，效率较低，但它可以处理数组元素为复杂对象的情况。

02.05 Array.prototype.some()：简洁高效的重复项检测

Array.prototype.some()方法可以检测数组中是否存在满足指定条件的元素。我们可以利用此方法实现数组去重，具体做法是：将数组元素作为参数传入some()方法，如果元素在数组中出现过，则返回true，否则返回false。这种方法的时间复杂度为O(n)，效率与Set方法和Array.prototype.filter()方法相当，但它不能返回去重后的数组，需要自行处理。

03 实际代码示例：一见胜千言

为了加深对上述去重方法的理解，我们通过几个实际的代码示例来演示其用法。

// 使用嵌套循环实现数组去重
const arr1 = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr1 = [];
for (let i = 0; i < arr1.length; i++) {
  let isUnique = true;
  for (let j = 0; j < uniqueArr1.length; j++) {
    if (arr1[i] === uniqueArr1[j]) {
      isUnique = false;
      break;
    }
  }
  if (isUnique) {
    uniqueArr1.push(arr1[i]);
  }
}
console.log(uniqueArr1); // [1, 2, 3, 4, 5]

// 使用Set实现数组去重
const arr2 = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr2 = [...new Set(arr2)];
console.log(uniqueArr2); // [1, 2, 3, 4, 5]

// 使用Array.prototype.filter()实现数组去重
const arr3 = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr3 = arr3.filter((item, index) => arr3.indexOf(item) === index);
console.log(uniqueArr3); // [1, 2, 3, 4, 5]

// 使用Array.prototype.indexOf()实现数组去重
const arr4 = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr4 = [];
const seenIndexes = [];
for (let i = 0; i < arr4.length; i++) {
  if (seenIndexes.indexOf(i) === -1) {
    uniqueArr4.push(arr4[i]);
    for (let j = i + 1; j < arr4.length; j++) {
      if (arr4[i] === arr4[j]) {
        seenIndexes.push(j);
      }
    }
  }
}
console.log(uniqueArr4); // [1, 2, 3, 4, 5]

// 使用Array.prototype.some()实现数组去重
const arr5 = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueArr5 = arr5.filter((item) => !arr5.some((otherItem) => otherItem === item));
console.log(uniqueArr5); // [1, 2, 3, 4, 5]