JavaScript数组去重的几种方法

积累知识，胜过积蓄金银！毕竟在文章开发的过程中，会遇到各种各样的问题，往往都是一些细节知识点还没有掌握好而导致的，因此基础知识点的积累是很重要的。下面本文《JavaScript数组去重方法有哪些？》，就带大家讲解一下知识点，若是你对本文感兴趣，或者是想搞懂其中某个知识点，就请你继续往下看吧~

最常用去重方式是[...new Set(arr)]，时间复杂度O(n)，支持NaN相等判断但对象需按key去重；对象数组推荐Map缓存key实现O(n)过滤；IE或稀疏数组需回退filter+indexOf。

用 Set 快速去重，但要注意对象和 NaN 的特殊行为

最常用也最快的去重方式是 Array.from(new Set(arr)) 或展开运算符写法 [...new Set(arr)]。它时间复杂度接近 O(n)，底层依赖引擎对 Set 的哈希优化。

但要注意：Set 判等基于 SameValueZero（即 === 规则），所以 NaN 和 NaN 被视为相等，能正确去重；而对象即使内容相同，引用不同就仍是不同元素——{a:1} 和 {a:1} 不会去重。

• 原始数组含字符串、数字、布尔值时，[...new Set(arr)] 是首选
• 遇到对象数组，必须换策略（见下一条）
• 若需保留原始顺序，Set 方式天然支持；而用 filter() + indexOf() 会慢且不稳定（indexOf 总从头找）

对象数组去重：按指定 key 提取唯一项

对 [{id:1,name:'a'}, {id:2,name:'b'}, {id:1,name:'c'}] 这类数据，得靠 Map 或临时键值索引。直接用 JSON.stringify 对比性能差、还可能因属性顺序或 undefined 导致误判。

推荐用 Map 缓存已见的 key 值：

const uniqueByKey = (arr, key) => {
  const seen = new Map();
  return arr.filter(item => {
    const k = item[key];
    if (seen.has(k)) return false;
    seen.set(k, true);
    return true;
  });
};
// 使用：uniqueByKey(list, 'id')

• 比双重循环或 findIndex 查找快一个数量级（O(n) vs O(n²)）
• key 必须是基本类型（如 string/number）；若需复合 key，可拼接成字符串（如 item.a + '|' + item.b）
• 不修改原数组，返回新数组——这点和 Set 一致

需要兼容 IE 或处理稀疏数组？避免用扩展运算符

[...new Set(arr)] 在 IE 完全不支持，且对稀疏数组（如 [1, , 3]）会展开为 [1, undefined, 3]，丢失“空位”语义。如果项目仍需支持旧环境，或明确要保留稀疏性，就得回退到传统方法。

• 用 filter() + indexOf() 最兼容，但性能差，仅适合小数组（
• 手动 for 循环 + includes() 或哈希对象记录已见值，可控性强
• 现代项目建议用 Babel 转译或直接放弃 IE；稀疏数组场景本身极少，多数时候填 undefined 更安全

去重只是第一步，后续操作常决定整体效率

实际业务中，去重往往不是终点。比如从后端拿到用户列表后去重，紧接着要渲染、排序、分页。这时候如果在每一步都生成新数组（如先去重、再 sort()、再 slice()），内存和 GC 压力会明显上升。

• 链式调用时注意：map()、filter()、sort() 都返回新数组，连续三次调用 = 三份内存拷贝
• 大数据量下，考虑用 for 循环合并逻辑（例如边遍历边去重+筛选+计数）
• 如果只是校验是否重复，用 new Set(arr).size === arr.length 比全量去重快得多

到这里，我们也就讲完了《JavaScript数组去重的几种方法》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！