17370845950

Map 和 Set 是 JavaScript 中专用于键值映射和值去重的集合结构，相比 Object 更可靠、可迭代、无原型干扰且支持任意类型键或值；Map 适合动态键值操作，Set 适合唯一值管理。

Map 和 Set 是 JavaScript 中两种内置的集合数据结构，分别用于存储键值对和唯一值。它们和普通对象（Object）在设计目标、使用场景和底层行为上有本质区别。

Map：更可靠的键值容器

Map 允许任意类型（包括对象、函数、Symbol 甚至 null）作为键，而对象只能用字符串或 Symbol 作键（且会自动转为字符串）。Map 的键是严格相等比较（===），不会发生隐式转换；对象的属性名则总是被强制转成字符串，导致 {[1]: 'a', [true]: 'b'} 实际变成 {'1': 'a', 'true': 'b'}。

Map 还保持插入顺序，遍历时按添加顺序返回；对象的属性遍历顺序虽在 ES2015 后也基本按插入顺序，但仍有例外（如数字键会提前排序）。Map 提供了清晰的方法接口：set()、get()、has()、delete()、size 和可迭代的 keys()/values()/entries()。

• 用 Map 存储 DOM 元素与对应状态时，直接用元素本身作键，无需担心 key 冲突或类型转换
• 需要频繁增删查操作且键类型不固定时，Map 性能更稳定（V8 引擎对其做了专门优化）
• 想快速获取键值对数量？直接读 map.size，不用 Object.keys(obj).length

Set：专注去重的值集合

Set 只存储值，不存键，且自动确保所有值唯一。它的去重基于 SameValueZero 算法（类似 ===，但 NaN 和 NaN 被视为相等）。对象没有原生去重能力，模拟类似功能需手动遍历比对，效率低且易出错。

立即学习“Java免费学习笔记（深入）”；

Set 同样保持插入顺序，支持 add()、has()、delete()、size，并可直接用 for...of 遍历。它还提供实用的集合运算方法（需配合扩展运算符或 Array.from）：

• 数组去重：[...new Set([1, 2, 2, 3])] → [1, 2, 3]
• 求交集：[...new Set(arr1)].filter(x => new Set(arr2).has(x))
• 合并多个数组并去重：[...new Set([...arr1, ...arr2, ...arr3])]

与 Object 的核心差异总结

对象的核心定位是“结构化数据”或“命名空间”，强调属性语义（如 user.name、config.timeout）；Map 和 Set 的定位是“通用集合”，强调数据组织逻辑（映射关系、唯一性、可迭代性）。

• 对象有原型链，可能意外继承属性（需用 hasOwnProperty 或 Object.hasOwn 判断）；Map 和 Set 是纯净数据结构，无原型干扰
• 对象不能直接用 for...of 遍历（除非定义 [Symbol.iterator]）；Map 和 Set 原生可迭代
• 对象的 JSON 序列化天然支持；Map 和 Set 不会被 JSON.stringify 处理（需手动转换）
• 对象适合静态配置、API 响应建模；Map/Set 更适合运行时动态集合操作

什么时候该选谁？

如果只是存几个固定字段（比如用户信息），用对象更自然、可读性强；如果要以非字符串类型为索引做查找、缓存或状态管理，优先选 Map；如果只关心某组值是否出现过（如已加载的模块名、点击过的 ID），Set 比用对象模拟 {id: true} 更直观、内存更省、语义更准。

不复杂但容易忽略。