17370845950

Map和Set是解决对象局限的专用工具：Map支持任意类型键、保持插入顺序、无原型污染、原生size属性；Set自动去重、O(1)查询、正确处理NaN、强调存在性而非索引。

Map 和 Set 不是对象的替代品，而是解决对象固有局限的专用工具。它们和普通对象在设计目标、行为规则和性能表现上存在本质差异。

Map 与普通对象的核心区别

普通对象（{}）本质上是字符串键的映射，而 Map 是真正支持任意类型键的键值对集合：

• 键类型自由：Map 的键可以是对象、函数、数字、NaN、Symbol 等；对象的键只能是字符串或 Symbol（其他类型会被隐式转为字符串，比如 {[1]: 'a'} 实际等价于 {'1': 'a'}）
• 插入顺序保证：Map 遍历时严格按插入顺序返回；对象属性遍历顺序在 ES2015 后虽也基本有序，但语义上不承诺，且原型属性可能干扰
• 无原型污染风险：Map 不继承 Object.prototype，不会因 map.has('toString') 这类操作误判；对象若未用 Object.create(null) 创建，就可能被原型链上的同名属性干扰
• 原生尺寸获取：Map 直接提供 size 属性；对象需靠 Object.keys(obj).length，且无法准确统计不可枚举或 Symbol 键

Set 与数组/对象模拟集合的区别

Set 是专为“唯一值集合”设计的数据结构，不是数组的简化版：

• 自动去重：添加重复值（包括 NaN === NaN 为 false，但 Set 中仍视为相同）会被静默忽略；数组去重需手动过滤，时间复杂度 O(n²)
• O(1) 成员检测：set.has(value) 平均时间复杂度为常数级；数组用 includes() 或 indexOf() 是 O(n)
• 值唯一性判断更合理：Set 使用“SameValueZero”算法，能正确识别 NaN 重复；而对象键无法存两个 NaN（都会变成字符串 'NaN'），数组也无法直接判断 NaN 是否已存在
• 无索引概念：Set 不提供下标访问（如 set[0] 无效），强调“存在性”而非“位置”，避免误用

该优先用 Map 的典型场景

当你需要以非字符串值为标识、或对键值对操作有明确顺序和性能要求时：

• 用 DOM 元素、React 组件实例、Class 实例等作为键来缓存数据（例如：记录某个按钮是否已绑定过事件）
• 构建临时配置映射表，键是用户输入的动态字段名（含数字、布尔值甚至对象），且后续要按录入顺序渲染或导出
• 实现 LRU 缓存：利用 Map 插入顺序特性，map.keys().next().value 可快速获取最早插入项
• 处理表单数据或 URL 查询参数，其中键可能是数字 ID 或嵌套对象，且需频繁增删查

该优先用 Set 的典型场景

当你关注“某值是否存在”或“确保不重复”时，Set 比数组或对象更自然、更高效：

• 数组去重：[...new Set(arr)] 是最简洁可靠的写法，兼容所有类型（含对象引用）
• 权限控制列表：维护一组允许的操作标识符（如 ['read', 'edit', 'delete']），用 set.has('edit') 判断权限，比数组 includes 快得多
• 状态管理中的“已加载 ID 集合”：例如记录哪些商品 ID 已请求过详情，避免重复请求
• 实现交集、并集、差集运算：配合扩展运算符和过滤逻辑，比嵌套循环清晰（如 new Set([...a].filter(x => b.has(x))))）