JavaScript 中 Map 的完整解析

Map 是 ES6 新增的键值对集合类型 ，专门用于解决普通对象（{}）作为键值存储的痛点（比如键只能是字符串 / 符号、无法直接获取长度等）。

1. 核心特性

特性	说明
键的类型	可以是任意类型（数字、字符串、布尔值、对象、函数、null/undefined）
遍历顺序	严格按照插入顺序遍历（普通对象不保证）
长度获取	直接通过 **map.size**获取（普通对象需手动计算 Object.keys(obj).length）
键的唯一性	同一个键只能存一个值（重复设值会覆盖）
内存 / 性能	存储大量键值对时，Map 的增删查效率优于普通对象

2. 基础用法

1. 创建 Map

// 方式1：创建空 Map
const map1 = new Map();

// 方式2：初始化带键值对（传入二维数组，每一项是 [键, 值]）
const map2 = new Map([
  [1, '数字1'],        // 数字键
  ['name', '张三'],    // 字符串键
  [true, '布尔值'],    // 布尔键
  [{id: 1}, '对象键'], // 对象键（普通对象做不到！）
  [() => {}, '函数键'] // 函数键
]);

console.log(map2.size); // 输出 5（获取键值对数量）

2. 新增 / 修改键值对（set）

set(键, 值)：若键已存在则修改值 ，不存在则新增 ，返回 Map 本身（可链式调用）。

const map = new Map();
map.set('age', 20); // 新增
map.set('age', 21); // 修改（覆盖原有值）
map.set('name', '李四').set('gender', '男'); // 链式调用

console.log(map.get('age')); // 输出 21
console.log(map.get('name')); // 输出 李四

3. 获取值（get）

get(键)：返回对应值，若键不存在则返回 undefined。

const map = new Map([['name', '张三']]);
console.log(map.get('name')); // 张三
console.log(map.get('age'));  // undefined

4. 检查键是否存在（has）

has(键)：返回布尔值（true/false）。

const map = new Map([['name', '张三']]);
console.log(map.has('name')); // true
console.log(map.has('age'));  // false

5. 删除键值对（delete）

delete(键)：删除指定键，成功返回 true，失败（键不存在）返回 false。

const map = new Map([['name', '张三'], ['age', 20]]);
map.delete('age'); // true
console.log(map.size); // 1
console.log(map.delete('gender')); // false（键不存在）

6. 清空所有键值对（clear）

const map = new Map([['name', '张三']]);
map.clear();
console.log(map.size); // 0

3. 遍历 Map（重点！）

Map 支持多种遍历方式，且遍历顺序永远等于插入顺序：

（1）forEach 遍历（最常用）

const map = new Map([['name', '张三'], ['age', 20]]);
// forEach(值, 键, 原Map)
map.forEach((value, key) => {
  console.log(`键：${key}，值：${value}`);
});
// 输出：
// 键：name，值：张三
// 键：age，值：20

（2）for...of 遍历

const map = new Map([['name', '张三'], ['age', 20]]);

// 方式1：遍历 [键, 值] 对
for (const [key, value] of map) {
  console.log(key, value); // name 张三 → age 20
}

// 方式2：只遍历键（map.keys()）
for (const key of map.keys()) {
  console.log(key); // name → age
}

// 方式3：只遍历值（map.values()）
for (const value of map.values()) {
  console.log(value); // 张三 → 20
}

4. Map 与普通对象（{}）的核心区别

对比维度	Map	普通对象 {}
键的类型	任意类型（数字、对象、函数等）	仅字符串 / 符号（其他类型会转字符串）
遍历顺序	插入顺序	ES6 后基本按插入顺序，但不保证（如数字键会优先）
长度获取	map.size（直接获取）	Object.keys(obj).length（手动计算）
原型污染	无（自身无默认键）	可能（如 obj.__proto__ 是原型链属性）
性能	大量增删查时更优	少量键值对时更轻便