如何实现数组的去重？请写出至少三种方法。

推荐答案

方法一：使用 Set

// www.javascriptcn.com code example
function uniqueArrayWithSet(arr) {
  return Array.from(new Set(arr));
  // 或者更简洁的写法: return [...new Set(arr)]
}

// 示例
const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = uniqueArrayWithSet(arr);
console.log(uniqueArr); // 输出：[1, 2, 3, 4, 5]

方法二：使用 filter 和 indexOf

function uniqueArrayWithFilter(arr) {
    return arr.filter((item, index) => arr.indexOf(item) === index);
}

// 示例
const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = uniqueArrayWithFilter(arr);
console.log(uniqueArr); // 输出：[1, 2, 3, 4, 5]

方法三：使用 reduce 和 includes

// www.javascriptcn.com code example
function uniqueArrayWithReduce(arr) {
  return arr.reduce((unique, item) => {
    if (!unique.includes(item)) {
      unique.push(item);
    }
    return unique;
  }, []);
}

// 示例
const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = uniqueArrayWithReduce(arr);
console.log(uniqueArr); // 输出：[1, 2, 3, 4, 5]

本题详细解读

方法一：使用 Set

• 原理: Set 是 ES6 引入的一种新的数据结构，它类似于数组，但是成员的值都是唯一的，没有重复的值。 利用 Set 这个特性，将数组转换为 Set，会自动去除重复的元素，然后再将 Set 转回数组。
• 优点:
  • 代码简洁易懂。
  • 效率较高，特别是对于大型数组，性能优于使用 indexOf 或 includes 方法。
  • 能有效去除 NaN 和 undefined 的重复项。
• 缺点:
  • 不能去重对象类型，因为对象在 Set 中比较的是引用而不是值。

方法二：使用 filter 和 indexOf

• 原理: 利用 filter 方法遍历数组，对于每一个元素，使用 indexOf 方法查找该元素第一次出现的索引，如果当前遍历到的索引和第一次出现的索引一致，则说明该元素是第一次出现，保留下来；否则，说明是重复元素，过滤掉。
• 优点:
  • 容易理解，代码相对简单。
• 缺点:
  • 效率相对较低，每次使用 indexOf 都会遍历数组，时间复杂度为 O(n^2)。
  • 不能区分 NaN， indexOf 无法找到 NaN。
  • 无法去重对象类型。

方法三：使用 reduce 和 includes

• 原理: 使用 reduce 方法遍历数组，初始值为空数组，对于每一个元素，检查当前累积的数组是否已经包含该元素，如果不包含，则将该元素添加到累积数组中。
• 优点:
  • 代码相对清晰，易于理解。
• 缺点:
  • 效率相对较低，每次使用 includes 都会遍历累积的数组，时间复杂度为 O(n^2)。
  • 不能区分 NaN，includes 无法找到 NaN。
  • 无法去重对象类型。

总结