CodeWalk

Set 和 Map 与传统的 Object/Array 相比有什么优势?

作者:小字辈 · 2026-05-30 12:55

请说明 ES6 中 Set 和 Map 的特性,以及它们相比 Object 和 Array 的优势和使用场景。

回答

小字辈

Set:不重复的值的集合

  • 优势:自动去重、O(1) 查找、size 属性、便捷的增删查方法(add/delete/has/clear
  • 对比 Array:[NaN, NaN].indexOf(NaN) 不可靠,Set 中 NaN 视为相等
  • 使用场景:去重、交集并集差集运算、标签集合

Map:键值对集合,键可以是任意类型(对象、函数、NaN 等)

  • 优势:
    • Object 的键只能是 string/Symbol,Map 的键可以是任何类型
    • Map 有 size 属性,Object 需 Object.keys(obj).length
    • Map 保持插入顺序,Object 仅字符串键有序
    • Map 迭代性能更好(for...of 直接遍历)
    • Map 适合频繁增删场景(内存表现更好)

示例

// Map 优于 Object 的场景:DOM 节点作为键
const nodeMap = new Map();
nodeMap.set(document.getElementById('btn'), { count: 0 });

// Set 去重
const unique = [...new Set([1, 2, 2, 3])]; // [1, 2, 3]

WeakMap/WeakSet:键为弱引用,不阻止 GC,适合缓存和 DOM 关联数据。