ES6 中的 Map 和 Set 详解

你想了解 ES6 新增的两个数据结构 Map 和 Set，它们是对 JS 原有对象、数组数据结构的补充，解决了传统数据结构的痛点，日常开发中高频使用。

我会用通俗定义+核心特性+代码示例+使用场景的方式讲清楚，新手也能直接看懂。

一、Set 集合

1. 是什么？

Set 是无重复值的有序集合，类似于数组，但成员值唯一，不能重复。
它存储的是值（value），不是键值对。

2. 核心特性

• 自动去重（最常用功能）
• 成员唯一，没有下标索引
• 可存储任意类型数据（基本类型/引用类型）
• 判断重复用 SameValueZero 规则（NaN 等于 NaN，{} 互不相等）

3. 常用 API

// 1. 创建 Set
const set = new Set();

// 2. 添加元素
set.add(1);
set.add(2);
set.add(2); // 重复，自动忽略
set.add({});
set.add({}); // 两个空对象不相等，都会保留

// 3. 删除元素
set.delete(1);

// 4. 判断是否存在
console.log(set.has(2)); // true

// 5. 获取长度
console.log(set.size); // 3

// 6. 清空所有元素
// set.clear();

// 7. 遍历
set.forEach(item => console.log(item));
for (let item of set) { console.log(item); }

// 8. Set 转数组（最常用：数组去重）
const arr = [...set];
const uniqueArr = [...new Set([1,2,2,3])]; // [1,2,3]

4. 经典使用场景

1. 数组去重（一行代码搞定）
2. 存储不重复的数据列表（如标签、关键词）
3. 快速判断某个值是否存在（比数组 includes 性能更高）

二、Map 映射

1. 是什么？

Map 是键值对的有序映射表，类似于对象，但键可以是任意类型（字符串、数字、对象、函数都能当键）。

2. 核心特性

• 键值对存储，键唯一
• 键可以是任意类型（对象、数组、函数、Symbol 都行）
• 有序存储（按插入顺序保存）
• 自带长度属性，遍历方便

3. 为什么要用 Map 而不用普通对象？

普通对象的缺陷：

• 键只能是字符串/Symbol
• 有原型链污染风险
• 无法直接获取长度
• 键无序

Map 完美解决这些问题。

4. 常用 API

// 1. 创建 Map
const map = new Map();

// 2. 添加键值对（键可以是任意类型）
map.set('name', '小明'); // 字符串键
map.set(18, '年龄');     // 数字键
map.set({}, '空对象');   // 对象键
map.set([], '空数组');   // 数组键

// 3. 获取值
console.log(map.get('name')); // 小明

// 4. 判断键是否存在
console.log(map.has(18)); // true

// 5. 删除键值对
map.delete(18);

// 6. 获取长度
console.log(map.size); // 3

// 7. 清空
// map.clear();

// 8. 遍历
map.forEach((value, key) => console.log(key, value));
for (let [key, value] of map) { console.log(key, value); }

// 9. Map 与对象互转
const obj = Object.fromEntries(map); // Map → 对象
const newMap = new Map(Object.entries(obj)); // 对象 → Map

5. 经典使用场景

1. 复杂数据映射（键不是字符串时）
2. 缓存数据、字典配置
3. 需要严格有序的键值对
4. 频繁增删键值对的场景（性能优于对象）

三、快速对比：Set vs Map

四、极简记忆口诀

• Set 存值，自动去重，适合做集合
• Map 存键值，键任意，适合做映射
• 都用 size 取长度，都用 for...of 遍历

总结

1. Set = 无重复的集合，主打去重
2. Map = 高级版对象，主打任意类型键 + 有序 + 高性能
3. 它们都是 ES6 解决传统数据结构痛点的核心工具