js数组去重的5种方法：JS数组去重的5种实用方法，轻松解决重复数据问题！

来源：网络作者：日期：2025-10-22 21:22:35

在JavaScript开发中,数组去重是一个常见的需求，无论是处理用户列表、商品数据，还是其他需要唯一值的场景，去重都能帮助我们更高效地管理数据，本文将介绍5种常用的JS数组去重方法，从原理到实现，一步步带你掌握这些实用技巧。

使用 `Set` 对象（ES6+）

Set 是ES6引入的一种新型数据结构，它只存储唯一的值，自动去重，利用这一点，我们可以轻松实现数组去重。

代码示例：

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

优点：

代码简洁,一行搞定。
性能较高,适合处理大型数组。

缺点：

依赖ES6语法,兼容性较差（现代浏览器和Node.js环境已广泛支持）。

利用 `indexOf` 手动去重

这是ES6之前的经典方法,通过遍历数组，检查当前元素是否已存在，若不存在则保留。

js数组去重的5种方法：JS数组去重的5种实用方法，轻松解决重复数据问题！

代码示例：

const arr = [1, 2, 2, 3, 4, 4, 5];
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²)），对于大型数组性能较差。

使用 `filter` 和 `indexOf` 组合

结合 filter 方法和 indexOf，可以更简洁地实现去重。

代码示例：

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

优点：

代码简洁,可读性强。
兼容性较好。

缺点：

仍然依赖 indexOf，时间复杂度较高。

使用 `reduce` 方法去重

reduce 是ES5引入的数组方法，可以灵活地对数组进行操作，包括去重。

js数组去重的5种方法：JS数组去重的5种实用方法，轻松解决重复数据问题！

代码示例：

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

优点：

灵活性高,适合复杂逻辑。
可以保留数组的顺序。

缺点：

兼容性稍差（IE不支持），需注意环境。

使用 `Map` 对象去重

Map 是ES6引入的键值对数据结构，可以利用其键的唯一性来实现去重。

代码示例：

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = Array.from(new Map(arr.map(item => [item, 1])).keys());
console.log(uniqueArr); // [1, 2, 3, 4, 5]