JavaScript数组去重的5种高效方法

# JavaScript数组去重的5种高效方法

## 1. 使用Set数据结构

Set是ES6引入的新数据结构，它只存储唯一值，自动过滤重复元素。

```javascript

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

const uniqueArr = [...new Set(arr)];

console.log(uniqueArr); // [1, 2, 3, 4, 5]

```

优点：代码简洁，性能优秀

缺点：无法处理包含对象的数组

## 2. 使用filter和indexOf方法

通过检查元素第一次出现的位置来判断是否为重复元素。

```javascript

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

const uniqueArr = arr.filter((item, index) => arr.indexOf(item) === index);

console.log(uniqueArr); // [1, 2, 3, 4, 5]

```

优点：兼容性好，适用于简单数据类型

缺点：对于大型数组性能较差

## 3. 使用reduce方法

利用reduce方法构建不包含重复元素的新数组。

```javascript

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

const uniqueArr = arr.reduce((acc, current) => {

if (!acc.includes(current)) {

acc.push(current);

}

return acc;

}, []);

console.log(uniqueArr); // [1, 2, 3, 4, 5]

```

优点：功能强大，可扩展性好

缺点：代码相对复杂

## 4. 使用Map数据结构

利用Map的键唯一性特性实现去重。

```javascript

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

const uniqueArr = [...new Map(arr.map(item => [item, item])).values()];

console.log(uniqueArr); // [1, 2, 3, 4, 5]

```

优点：性能优秀，适用于各种数据类型

缺点：代码可读性稍差

## 5. 使用Object键值对

利用对象的属性名唯一性进行去重。

```javascript

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

const obj = {};

arr.forEach(item => obj[item] = true);

const uniqueArr = Object.keys(obj).map(Number);

console.log(uniqueArr); // [1, 2, 3, 4, 5]

```

优点：性能较好

缺点：只适用于字符串和数字类型

## 性能比较

在大多数情况下，Set方法的性能最优，特别是在处理大型数组时。filter+indexOf方法在小规模数据上表现尚可，但随着数据量增大性能下降明显。

## 总结

根据具体场景选择合适的去重方法：

- 现代浏览器环境：优先使用Set

- 需要兼容旧浏览器：使用filter+indexOf

- 处理复杂数据类型：考虑使用Map

- 性能要求极高：测试不同方法选择最优方案