JS如何去除数组中相同的数值？

如何在 JavaScript 中高效去除数组中的重复元素

Set：高效去重

Set 是 JavaScript 中一个内置的数据结构，专门用于存储唯一值。它提供了一种简单且高效的方法来去除数组中的重复元素。

使用 Set 去重的步骤：

1. 将数组转换为 Set 对象。
2. 再将 Set 对象转换为数组。

const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [...new Set(numbers)]; // [1, 2, 3, 4, 5]

indexOf：灵活排序

indexOf 方法返回指定元素在数组中的第一个索引。通过 indexOf，我们可以逐个遍历数组，并删除重复的元素。

使用 indexOf 去重的步骤：

1. 使用循环遍历数组。
2. 对于每个元素，使用 indexOf 检查其在数组中的索引是否与其当前位置一致。
3. 如果不一致，则删除重复元素。

const numbers = [1, 2, 3, 4, 5, 1, 2, 3];

for (let i = 0; i < numbers.length; i++) {
  const index = numbers.indexOf(numbers[i]);
  if (index !== i) {
    numbers.splice(i, 1);
    i--; // 防止跳过元素
  }
} // [1, 2, 3, 4, 5]

filter：高效筛选

filter 方法返回一个新数组，其中包含通过指定函数筛选出的元素。我们可以使用 filter 来筛选出唯一元素。

使用 filter 去重的步骤：

1. 使用 filter 创建一个包含唯一元素的新数组。
2. 使用 indexOf 作为筛选函数，检查元素在数组中的索引是否与其当前位置一致。

const numbers = [1, 2, 3, 4, 5, 1, 2, 3];

const uniqueNumbers = numbers.filter((number, index) => {
  return numbers.indexOf(number) === index;
}); // [1, 2, 3, 4, 5]

splice：原地修改

splice 方法允许我们直接修改数组，包括删除元素。我们可以使用 splice 来原地去除重复元素。

使用 splice 去重的步骤：

1. 使用循环遍历数组。
2. 对于每个元素，使用 indexOf 检查其在数组中的索引是否与其当前位置一致。
3. 如果不一致，则使用 splice 删除重复元素。

const numbers = [1, 2, 3, 4, 5, 1, 2, 3];

for (let i = 0; i < numbers.length; i++) {
  const index = numbers.indexOf(numbers[i]);
  if (index !== i) {
    numbers.splice(i, 1);
  }
} // [1, 2, 3, 4, 5]

总结

去除数组中重复元素有多种方法，每种方法都有其优点和缺点：

• Set： 高效，不改变原数组，但不支持索引和迭代。
• indexOf： 灵活，可以控制删除顺序，但效率较低。
• filter： 高效，可与其他方法结合使用，但需要创建新数组。
• splice： 原地修改，但效率较低。

根据数组大小、是否需要控制删除顺序、是否需要对去重后的数组进行进一步操作等因素选择合适的方法。

常见问题解答

1. 去除对象数组中的重复对象时怎么办？
   可以使用 JSON.stringify() 和 Set 的组合，先将对象转换为字符串，再使用 Set 去重。
2. 去除多维数组中的重复元素呢？
   可以使用递归或 JSON.stringify() 和 Set 的组合。
3. 如何保持去重后的数组顺序不变？
   可以使用 indexOf 和 filter 的组合，并使用 indexOf 作为 filter 的筛选函数。
4. 去除 NaN 值时需要注意什么？
   NaN 是唯一与自身不相等的特殊值，使用 indexOf 或 filter 去重时需要特殊处理。
5. 如何同时去除 null 和 undefined 值？
   可以使用 filter 方法，并使用 (value !== null && value !== undefined) 作为筛选条件。