下面给你一份 最新整理的 JavaScript 数组去重四大常见方法，包含写法、原理、优缺点与最佳实践，一看就明白、可直接用于面试笔记。
✅ 1. 使用 ES6 Set 去重（最推荐）
✔ 写法最短
✔ 性能最好
✔ 可去除所有重复，包括对象引用一致的情况
const arr = [1, 2, 2, 3, 4, 4];
const result = [...new Set(arr)];
console.log(result); // [1, 2, 3, 4]
适用场景
- 数字、字符串、布尔等基础类型
- 对象引用相同的情况也能处理
不适用
- 对象内容相同但引用不同（Set 认为不相等）
const arr = [{a:1}, {a:1}];
new Set(arr); // 不去重
✅ 2. 使用 filter + indexOf 去重（传统方法）
原理：
indexOf 总是返回元素第一次出现的位置。
const arr = [1, 2, 2, 3];
const result = arr.filter((item, index) => {
return arr.indexOf(item) === index;
});
console.log(result); // [1, 2, 3]
优点
- 可读性强
- 兼容老浏览器（ES5）
缺点
- 时间复杂度 O(n²)（因为 indexOf 内部是循环）
✅ 3. 使用 reduce + Map（可处理对象内容相同）
这是项目中高级写法，可按对象字段去重。
const arr = [
{ id: 1, name: "A" },
{ id: 1, name: "A" },
{ id: 2, name: "B" }
];
const result = arr.reduce((map, item) => {
if (!map.temp.has(item.id)) {
map.temp.add(item.id);
map.result.push(item);
}
return map;
}, { temp: new Set(), result: [] }).result;
console.log(result);
// [ { id: 1, name: "A" }, { id: 2, name: "B" } ]
优点
- 可按对象中某个 key 去重
- 性能比 indexOf 方法好很多（近似 O(n)）
缺点
- 代码量稍多
✅ 4. 使用 sort + 遍历相邻元素（适合超大数组）
原理：
先排序 → 相同的值就在一起 → 逐个比较
const arr = [3, 1, 2, 2, 3];
const result = arr
.sort((a, b) => a - b)
.filter((item, index, array) => {
return index === 0 || item !== array[index - 1];
});
console.log(result); // [1, 2, 3]
优点
- 排序后只需一次遍历，性能好（O(n log n)）
缺点
- 改变原数组排序
- 需要自定义排序规则（字符串数字等）
🎯 四种方法对比总结
| 方法 | 代码量 | 性能 | 是否保留原顺序 | 对象内容去重 |
|---|---|---|---|---|
| Set | 最少 | ✔✔✔（最快） | ✔ | ✘ |
| filter + indexOf | 中等 | ✘（慢） | ✔ | ✘ |
| reduce + Map/Set | 较多 | ✔✔ | ✔ | ✔（最佳） |
| sort + 遍历 | 一般 | ✔✔ | ✘（会排序） | ✘ |
📌 实际项目中的最佳实践推荐
✔ 基础类型数组（数字/字符串）
[...new Set(arr)]
✔ 多字段对象数组去重
reduce + Map/Set
✔ 大数据量数组，需要性能
sort + 遍历