Object和Map比较 | 流年石刻

这是一个非常核心且重要的问题。要彻底讲明白 JavaScript 中 Object ({}) 和 Map 的区别，我们需要从它们的设计哲学、内部机制和实际应用场景三个层面进行深入剖析。

这不仅仅是“Map 的键可以是任意类型”这么简单。

一、设计哲学的根本不同

首先，要理解它们被创造出来的目的是完全不同的。

Object ({})：语言的基石

Object 是 JavaScript 这门语言的根基和最核心的构建块。它的首要设计目标不是作为一个纯粹的“哈希表”或“字典”，而是作为一种描述事物、组织代码和实现继承的结构。你代码里几乎所有东西（除了原始类型）最终都源自于对象。它的存在是为了构建数据实体（比如一个用户、一个产品）和实现面向对象编程（通过原型链）。将它用作键值对存储，实际上是它核心功能的一种“兼职”应用。
Map：纯粹的数据结构

Map 是在 ES6 (2015) 中被引入的，它的诞生就是为了解决一个长期存在的痛点：JavaScript 缺少一个真正意义上的、高效且功能纯粹的**哈希映射（Hash Map）**数据结构。Map 的设计目标非常专一：高效、可靠地管理键值对集合。它不关心原型链，不关心你的键是什么类型，它的所有 API (set, get, has, delete等) 都是为此目的而生。

这个哲学的不同，导致了它们在具体实现和功能上的所有差异。

二、核心区别的深入剖析

下面的表格和解析会详细对比它们的技术细节。

特性	`Object` (`{}`)	`Map`	剖析与深入理解
键的类型 (Key Type)	字符串 (String) 或 Symbol	任意类型 (包括对象、函数、`NaN`)	这是最本质的区别。`Object` 的键最终都会被隐式转换为字符串。`o[1]` 和 `o["1"]` 是一样的。如果你尝试用一个对象作为键 `o[{a:1}] = true`，这个键实际上会变成字符串 `"[object Object]"`，导致所有不同的对象键都指向同一个值，这是灾难性的。`Map` 则不存在这个问题，它使用 `SameValueZero` 算法比较键，`NaN` 也能作为唯一的键，不同的对象引用就是不同的键。
原型与继承 (Prototype)	会继承原型链上的属性	纯净的键值对集合	一个空的 `Object` (`const obj = {}`) 并不“空”，它通过原型链继承了 `Object.prototype` 上的方法，如 `toString`, `hasOwnProperty` 等。这会带来潜在的风险：`obj.toString` 可能会被意外覆盖，或者 `for...in` 循环会遍历到原型链上的属性。`Map` 是一个纯粹的容器，它不会和你的数据键产生任何冲突。`map.get('toString')` 只会返回你显式设置的值。
元素顺序 (Order)	不保证 (现代引擎大多遵循插入顺序，但不应依赖)	保证插入顺序	`Map` 遍历时，会严格按照元素插入的顺序进行。这在需要保证顺序的场景下至关重要。虽然现代 JS 引擎对 `Object` 的属性顺序做了很多优化，使其在很多情况下表现为有序，但 ECMA 规范对此的定义非常复杂，且在某些边缘情况下（如数字键混合）顺序可能不符合直觉。依赖 `Object` 的顺序是脆弱的，而 `Map` 的顺序是可靠的承诺。
获取大小 (Size)	需手动计算: `Object.keys(obj).length`	直接获取: `map.size`	`map.size` 是一个属性，获取大小的操作是 O(1) 复杂度，非常高效。而 `Object.keys()` 会返回一个包含所有键的数组，再获取其长度，这个过程相对低效，尤其是在数据量大时。
API 与迭代	API 分散，迭代方式多样	统一、专用的 API 和迭代器	`Map` 提供了一套为键值操作量身定做的 API：`set`, `get`, `has`, `delete`, `clear`，非常清晰。它还内置了 `keys()`, `values()`, `entries()` 迭代器，可以非常方便地与 `for...of` 和解构赋值 (`for (const [key, value] of map)`) 配合使用。`Object` 的操作则相对分散（点/方括号赋值、`delete` 操作符、`hasOwnProperty` 方法等），`for...in` 循环还会遍历原型链，通常需要配合 `hasOwnProperty` 使用，比较繁琐。
性能 (Performance)	频繁增删性能较差	频繁增删性能更优	JS 引擎（如 V8）对 `Object` 的优化主要集中在“形状 (Shape/Hidden Class)”相对稳定的场景，即属性集合不经常变化的“类实例”模式。当 `Object` 被用作频繁添加和删除键的哈希表时，引擎需要不断更新其内部结构，导致性能下降。`Map` 的内部实现（通常是哈希表或类似结构）就是为这种动态增删场景优化的，性能表现更稳定、更可预测。
JSON 序列化	直接支持	默认不支持	`JSON.stringify` 可以直接将一个 `Object` 转换为 JSON 字符串。但它无法直接序列化一个 `Map`，结果会是一个空对象 `{}`。你需要自己编写转换函数来实现 `Map` 的序列化和反序列化。这是一个在与 API 或本地存储交互时非常重要的实际考量。

三、何时使用？给出我的选择

基于以上的深入剖析，选择的原则就变得非常清晰了：用其所长，回归本质。

选择 `Object` (`{}`) 的场景：

创建数据实体 / 结构化数据： 当你需要描述一个“东西”时，比如一个用户配置、一篇文章的属性。这些场景下，键是固定的、已知的字符串，Object 的字面量语法 const user = { name: 'Alex', age: 30 }; 非常简洁直观。这正是 Object 的设计初衷。
JSON 数据交换： 任何需要与 JSON 格式进行转换的场景。因为这是原生支持的，无需任何额外工作。Web 开发中与后端 API 的数据交互几乎都是这种情况。
简单的、一次性的轻量级数据存储： 如果你只是需要一个临时存放几个字符串键值对的地方，且不关心顺序和潜在的继承问题，使用对象字面量是最快捷的方式。

选择 `Map` 的场景：

真正的哈希表/字典需求： 当你需要一个纯粹的键值对集合，并且键的类型不确定时，必须使用 Map。例如，用 DOM 节点对象作为键来存储其状态信息。
频繁的增删操作： 如果你的集合会经历大量元素的添加和删除，Map 提供了更稳定和优秀的性能。例如用作缓存（Cache）实现。
需要保证顺序： 任何依赖于插入顺序的逻辑，都应该使用 Map。
键值对数量巨大： 当数据量很大时，Map 在增、删、查以及获取大小方面的综合性能表现通常更优。

结论与最终建议

Object 和 Map 并非取代关系，而是分工关系。

将 Object 当作哈希表的用法，更多是一种历史遗留问题。在 Map 出现之前，开发者别无选择。但现在，我们应该做出更明智的选择。

我的最终建议是：

默认使用 Map 来处理所有纯粹的键值对存储需求。让 Object 回归其作为“对象”和“数据记录”的本来职责。

遵循这个原则，你的代码会变得：

更安全： 避免了原型链污染和意外的键名冲突。
更清晰： Map 的 API 明确表达了你的意图就是在操作一个键值集合，代码更具可读性。
更可预测： 在性能和元素顺序上，Map 的行为都比 Object 更可靠。

只有在你明确知道键都是简单字符串，且需要与 JSON 交互，或者只是创建一个简单的结构化数据记录时，才应该优先使用 Object。在所有其他“我需要一个字典”的场景里，Map 都是更专业、更合适的工具。

Map常用方法

接下来深入讲解一下 Map 的常用方法。

Map 的 API 设计得非常直观和优雅，主要围绕着“增、删、改、查”这四个核心操作，并提供了强大的迭代能力。

下面我将这些方法分为几类来详细说明，并附上清晰的示例代码。

一、核心操作：增、删、改、查

这类方法是你日常使用 Map 最频繁的。

方法	描述	返回值	示例
`set(key, value)`	增加或修改一个键值对。如果 `key` 已存在，则更新其 `value`；如果不存在，则添加新的键值对。	返回 `Map` 对象本身，因此可以链式调用。	`map.set('name', 'Alex').set('age', 30);`
`get(key)`	查询指定 `key` 对应的 `value`。	返回对应的 `value`，如果 `key` 不存在，则返回 `undefined`。	`const name = map.get('name'); // 'Alex'` `const gender = map.get('gender'); // undefined`
`has(key)`	检查 `Map` 中是否存在指定的 `key`。	返回一个布尔值 (`true` 或 `false`)。	`map.has('age'); // true` `map.has('gender'); // false`
`delete(key)`	删除指定的键值对。	如果成功删除，返回 `true`；如果 `key` 不存在，返回 `false`。	`map.delete('age'); // true`
`clear()`	清空 `Map` 中所有的键值对。	`undefined`。	`map.clear(); // map 现在是空的了`

示例代码片段：

JavaScript

// 创建一个 Map
const userMap = new Map();

// 1. 使用 set() 进行增、改操作 (支持链式调用)
userMap.set('name', 'Bob'); // 新增
userMap.set('email', '[email protected]'); // 新增
userMap.set('name', 'Bob Smith'); // 修改已存在的 key

console.log(userMap); 
// 输出: Map(2) { 'name' => 'Bob Smith', 'email' => '[email protected]' }

// 2. 使用 get() 进行查询
console.log(userMap.get('name')); // 'Bob Smith'
console.log(userMap.get('phone')); // undefined

// 3. 使用 has() 进行检查
console.log(userMap.has('email')); // true
console.log(userMap.has('phone')); // false

// 4. 使用 delete() 进行删除
const wasDeleted = userMap.delete('email');
console.log(wasDeleted); // true
console.log(userMap.has('email')); // false

// 5. 使用 clear() 清空
userMap.clear();
console.log(userMap.size); // 0

二、属性与迭代

Map 的迭代能力是其相对于 Object 的一大优势。它内置了多种迭代器，可以与 for...of 循环完美结合。

属性/方法	描述	返回值	示例
`size`	一个属性（不是方法），用于获取 `Map` 中键值对的数量。	一个非负整数。	`const count = map.size;`
`keys()`	返回一个键的迭代器 (Iterator)，包含 `Map` 中所有的键。	一个新的 `Map Iterator` 对象。	`for (const key of map.keys()) { ... }`
`values()`	返回一个值的迭代器 (Iterator)，包含 `Map` 中所有的值。	一个新的 `Map Iterator` 对象。	`for (const value of map.values()) { ... }`
`entries()`	返回一个键值对的迭代器 (Iterator)，每个元素是一个 `[key, value]` 形式的数组。	一个新的 `Map Iterator` 对象。	`for (const entry of map.entries()) { ... }` `for (const [key, value] of map) { ... }`
`forEach(callbackFn, thisArg)`	按照插入顺序，为 `Map` 中的每个键值对执行一次提供的回调函数。	`undefined`。	`map.forEach((value, key, map) => { ... });`

关键点：

默认迭代器是 entries()：这意味着你可以直接在 Map 对象上使用 for...of 循环，它等同于调用 map.entries()。这是最常用、最方便的遍历方式。
回调函数参数顺序：注意 forEach 的回调函数签名是 (value, key, map)，这和数组的 (element, index, array) 有所不同，值在前，键在后。这在设计上是为了与 Array.prototype.forEach 的主要参数（值）保持一致。

示例代码片段：

JavaScript

const fruitMap = new Map([
  ['apple', 10],
  ['banana', 20],
  ['orange', 30]
]);

// 1. 获取大小
console.log(fruitMap.size); // 3

// 2. 遍历所有的键 (keys)
console.log('--- Keys ---');
for (const key of fruitMap.keys()) {
  console.log(key); // apple, banana, orange
}

// 3. 遍历所有的值 (values)
console.log('--- Values ---');
for (const value of fruitMap.values()) {
  console.log(value); // 10, 20, 30
}

// 4. 遍历所有的键值对 (entries) - 最常用的方式
console.log('--- Entries (Default Iterator) ---');
// 直接在 map 上使用 for...of，并使用解构赋值
for (const [fruit, price] of fruitMap) {
  console.log(`${fruit}: $${price}`);
  // apple: $10
  // banana: $20
  // orange: $30
}

// 5. 使用 forEach
console.log('--- forEach ---');
fruitMap.forEach((price, fruit) => {
  console.log(`The price of ${fruit} is ${price}`);
});

三、 `Map` 与 `Array` 的转换

在实际开发中，我们经常需要在 Map 和 Array 之间进行转换。

Map 转 Array：

使用 Array.from()
使用展开运算符 (...)

JavaScript

const map = new Map([['a', 1], ['b', 2]]);

// 转为键值对数组
const arrayFrom = Array.from(map); // [['a', 1], ['b', 2]]
const arraySpread = [...map];       // [['a', 1], ['b', 2]]

// 只转键
const keysArray = [...map.keys()]; // ['a', 'b']

// 只转值
const valuesArray = [...map.values()]; // [1, 2]

Array 转 Map：
- Map 的构造函数可以直接接收一个“键值对”形式的数组（即数组的每个元素也是一个包含两个元素的数组 [key, value]）。
JavaScript
```
const array = [['name', 'Chris'], ['age', 35]];
const map = new Map(array);

console.log(map.get('name')); // 'Chris'
```

这些就是 Map 的全部核心方法和属性。掌握了它们，你就能在各种场景下高效地使用 Map 来管理你的数据了。

这不仅仅是“Map 的键可以是任意类型”这么简单。

一、设计哲学的根本不同

首先，要理解它们被创造出来的目的是完全不同的。

Object ({})：语言的基石

Object 是 JavaScript 这门语言的根基和最核心的构建块。它的首要设计目标不是作为一个纯粹的“哈希表”或“字典”，而是作为一种描述事物、组织代码和实现继承的结构。你代码里几乎所有东西（除了原始类型）最终都源自于对象。它的存在是为了构建数据实体（比如一个用户、一个产品）和实现面向对象编程（通过原型链）。将它用作键值对存储，实际上是它核心功能的一种“兼职”应用。
Map：纯粹的数据结构

Map 是在 ES6 (2015) 中被引入的，它的诞生就是为了解决一个长期存在的痛点：JavaScript 缺少一个真正意义上的、高效且功能纯粹的**哈希映射（Hash Map）**数据结构。Map 的设计目标非常专一：高效、可靠地管理键值对集合。它不关心原型链，不关心你的键是什么类型，它的所有 API (set, get, has, delete等) 都是为此目的而生。

这个哲学的不同，导致了它们在具体实现和功能上的所有差异。

二、核心区别的深入剖析

下面的表格和解析会详细对比它们的技术细节。

特性	`Object` (`{}`)	`Map`	剖析与深入理解
键的类型 (Key Type)	字符串 (String) 或 Symbol	任意类型 (包括对象、函数、`NaN`)	这是最本质的区别。`Object` 的键最终都会被隐式转换为字符串。`o[1]` 和 `o["1"]` 是一样的。如果你尝试用一个对象作为键 `o[{a:1}] = true`，这个键实际上会变成字符串 `"[object Object]"`，导致所有不同的对象键都指向同一个值，这是灾难性的。`Map` 则不存在这个问题，它使用 `SameValueZero` 算法比较键，`NaN` 也能作为唯一的键，不同的对象引用就是不同的键。
原型与继承 (Prototype)	会继承原型链上的属性	纯净的键值对集合	一个空的 `Object` (`const obj = {}`) 并不“空”，它通过原型链继承了 `Object.prototype` 上的方法，如 `toString`, `hasOwnProperty` 等。这会带来潜在的风险：`obj.toString` 可能会被意外覆盖，或者 `for...in` 循环会遍历到原型链上的属性。`Map` 是一个纯粹的容器，它不会和你的数据键产生任何冲突。`map.get('toString')` 只会返回你显式设置的值。
元素顺序 (Order)	不保证 (现代引擎大多遵循插入顺序，但不应依赖)	保证插入顺序	`Map` 遍历时，会严格按照元素插入的顺序进行。这在需要保证顺序的场景下至关重要。虽然现代 JS 引擎对 `Object` 的属性顺序做了很多优化，使其在很多情况下表现为有序，但 ECMA 规范对此的定义非常复杂，且在某些边缘情况下（如数字键混合）顺序可能不符合直觉。依赖 `Object` 的顺序是脆弱的，而 `Map` 的顺序是可靠的承诺。
获取大小 (Size)	需手动计算: `Object.keys(obj).length`	直接获取: `map.size`	`map.size` 是一个属性，获取大小的操作是 O(1) 复杂度，非常高效。而 `Object.keys()` 会返回一个包含所有键的数组，再获取其长度，这个过程相对低效，尤其是在数据量大时。
API 与迭代	API 分散，迭代方式多样	统一、专用的 API 和迭代器	`Map` 提供了一套为键值操作量身定做的 API：`set`, `get`, `has`, `delete`, `clear`，非常清晰。它还内置了 `keys()`, `values()`, `entries()` 迭代器，可以非常方便地与 `for...of` 和解构赋值 (`for (const [key, value] of map)`) 配合使用。`Object` 的操作则相对分散（点/方括号赋值、`delete` 操作符、`hasOwnProperty` 方法等），`for...in` 循环还会遍历原型链，通常需要配合 `hasOwnProperty` 使用，比较繁琐。
性能 (Performance)	频繁增删性能较差	频繁增删性能更优	JS 引擎（如 V8）对 `Object` 的优化主要集中在“形状 (Shape/Hidden Class)”相对稳定的场景，即属性集合不经常变化的“类实例”模式。当 `Object` 被用作频繁添加和删除键的哈希表时，引擎需要不断更新其内部结构，导致性能下降。`Map` 的内部实现（通常是哈希表或类似结构）就是为这种动态增删场景优化的，性能表现更稳定、更可预测。
JSON 序列化	直接支持	默认不支持	`JSON.stringify` 可以直接将一个 `Object` 转换为 JSON 字符串。但它无法直接序列化一个 `Map`，结果会是一个空对象 `{}`。你需要自己编写转换函数来实现 `Map` 的序列化和反序列化。这是一个在与 API 或本地存储交互时非常重要的实际考量。

三、何时使用？给出我的选择

基于以上的深入剖析，选择的原则就变得非常清晰了：用其所长，回归本质。

选择 `Object` (`{}`) 的场景：

创建数据实体 / 结构化数据： 当你需要描述一个“东西”时，比如一个用户配置、一篇文章的属性。这些场景下，键是固定的、已知的字符串，Object 的字面量语法 const user = { name: 'Alex', age: 30 }; 非常简洁直观。这正是 Object 的设计初衷。
JSON 数据交换： 任何需要与 JSON 格式进行转换的场景。因为这是原生支持的，无需任何额外工作。Web 开发中与后端 API 的数据交互几乎都是这种情况。
简单的、一次性的轻量级数据存储： 如果你只是需要一个临时存放几个字符串键值对的地方，且不关心顺序和潜在的继承问题，使用对象字面量是最快捷的方式。

选择 `Map` 的场景：

真正的哈希表/字典需求： 当你需要一个纯粹的键值对集合，并且键的类型不确定时，必须使用 Map。例如，用 DOM 节点对象作为键来存储其状态信息。
频繁的增删操作： 如果你的集合会经历大量元素的添加和删除，Map 提供了更稳定和优秀的性能。例如用作缓存（Cache）实现。
需要保证顺序： 任何依赖于插入顺序的逻辑，都应该使用 Map。
键值对数量巨大： 当数据量很大时，Map 在增、删、查以及获取大小方面的综合性能表现通常更优。

结论与最终建议

Object 和 Map 并非取代关系，而是分工关系。

将 Object 当作哈希表的用法，更多是一种历史遗留问题。在 Map 出现之前，开发者别无选择。但现在，我们应该做出更明智的选择。

我的最终建议是：

默认使用 Map 来处理所有纯粹的键值对存储需求。让 Object 回归其作为“对象”和“数据记录”的本来职责。

遵循这个原则，你的代码会变得：

更安全： 避免了原型链污染和意外的键名冲突。
更清晰： Map 的 API 明确表达了你的意图就是在操作一个键值集合，代码更具可读性。
更可预测： 在性能和元素顺序上，Map 的行为都比 Object 更可靠。

Map常用方法

接下来深入讲解一下 Map 的常用方法。

Map 的 API 设计得非常直观和优雅，主要围绕着“增、删、改、查”这四个核心操作，并提供了强大的迭代能力。

下面我将这些方法分为几类来详细说明，并附上清晰的示例代码。

一、核心操作：增、删、改、查

这类方法是你日常使用 Map 最频繁的。

方法	描述	返回值	示例
`set(key, value)`	增加或修改一个键值对。如果 `key` 已存在，则更新其 `value`；如果不存在，则添加新的键值对。	返回 `Map` 对象本身，因此可以链式调用。	`map.set('name', 'Alex').set('age', 30);`
`get(key)`	查询指定 `key` 对应的 `value`。	返回对应的 `value`，如果 `key` 不存在，则返回 `undefined`。	`const name = map.get('name'); // 'Alex'` `const gender = map.get('gender'); // undefined`
`has(key)`	检查 `Map` 中是否存在指定的 `key`。	返回一个布尔值 (`true` 或 `false`)。	`map.has('age'); // true` `map.has('gender'); // false`
`delete(key)`	删除指定的键值对。	如果成功删除，返回 `true`；如果 `key` 不存在，返回 `false`。	`map.delete('age'); // true`
`clear()`	清空 `Map` 中所有的键值对。	`undefined`。	`map.clear(); // map 现在是空的了`

示例代码片段：

JavaScript

// 创建一个 Map
const userMap = new Map();

// 1. 使用 set() 进行增、改操作 (支持链式调用)
userMap.set('name', 'Bob'); // 新增
userMap.set('email', '[email protected]'); // 新增
userMap.set('name', 'Bob Smith'); // 修改已存在的 key

console.log(userMap); 
// 输出: Map(2) { 'name' => 'Bob Smith', 'email' => '[email protected]' }

// 2. 使用 get() 进行查询
console.log(userMap.get('name')); // 'Bob Smith'
console.log(userMap.get('phone')); // undefined

// 3. 使用 has() 进行检查
console.log(userMap.has('email')); // true
console.log(userMap.has('phone')); // false

// 4. 使用 delete() 进行删除
const wasDeleted = userMap.delete('email');
console.log(wasDeleted); // true
console.log(userMap.has('email')); // false

// 5. 使用 clear() 清空
userMap.clear();
console.log(userMap.size); // 0

二、属性与迭代

Map 的迭代能力是其相对于 Object 的一大优势。它内置了多种迭代器，可以与 for...of 循环完美结合。

属性/方法	描述	返回值	示例
`size`	一个属性（不是方法），用于获取 `Map` 中键值对的数量。	一个非负整数。	`const count = map.size;`
`keys()`	返回一个键的迭代器 (Iterator)，包含 `Map` 中所有的键。	一个新的 `Map Iterator` 对象。	`for (const key of map.keys()) { ... }`
`values()`	返回一个值的迭代器 (Iterator)，包含 `Map` 中所有的值。	一个新的 `Map Iterator` 对象。	`for (const value of map.values()) { ... }`
`entries()`	返回一个键值对的迭代器 (Iterator)，每个元素是一个 `[key, value]` 形式的数组。	一个新的 `Map Iterator` 对象。	`for (const entry of map.entries()) { ... }` `for (const [key, value] of map) { ... }`
`forEach(callbackFn, thisArg)`	按照插入顺序，为 `Map` 中的每个键值对执行一次提供的回调函数。	`undefined`。	`map.forEach((value, key, map) => { ... });`

关键点：

默认迭代器是 entries()：这意味着你可以直接在 Map 对象上使用 for...of 循环，它等同于调用 map.entries()。这是最常用、最方便的遍历方式。
回调函数参数顺序：注意 forEach 的回调函数签名是 (value, key, map)，这和数组的 (element, index, array) 有所不同，值在前，键在后。这在设计上是为了与 Array.prototype.forEach 的主要参数（值）保持一致。

示例代码片段：

JavaScript

const fruitMap = new Map([
  ['apple', 10],
  ['banana', 20],
  ['orange', 30]
]);

// 1. 获取大小
console.log(fruitMap.size); // 3

// 2. 遍历所有的键 (keys)
console.log('--- Keys ---');
for (const key of fruitMap.keys()) {
  console.log(key); // apple, banana, orange
}

// 3. 遍历所有的值 (values)
console.log('--- Values ---');
for (const value of fruitMap.values()) {
  console.log(value); // 10, 20, 30
}

// 4. 遍历所有的键值对 (entries) - 最常用的方式
console.log('--- Entries (Default Iterator) ---');
// 直接在 map 上使用 for...of，并使用解构赋值
for (const [fruit, price] of fruitMap) {
  console.log(`${fruit}: $${price}`);
  // apple: $10
  // banana: $20
  // orange: $30
}

// 5. 使用 forEach
console.log('--- forEach ---');
fruitMap.forEach((price, fruit) => {
  console.log(`The price of ${fruit} is ${price}`);
});

三、 `Map` 与 `Array` 的转换

在实际开发中，我们经常需要在 Map 和 Array 之间进行转换。

Map 转 Array：

使用 Array.from()
使用展开运算符 (...)

JavaScript

const map = new Map([['a', 1], ['b', 2]]);

// 转为键值对数组
const arrayFrom = Array.from(map); // [['a', 1], ['b', 2]]
const arraySpread = [...map];       // [['a', 1], ['b', 2]]

// 只转键
const keysArray = [...map.keys()]; // ['a', 'b']

// 只转值
const valuesArray = [...map.values()]; // [1, 2]

Array 转 Map：
- Map 的构造函数可以直接接收一个“键值对”形式的数组（即数组的每个元素也是一个包含两个元素的数组 [key, value]）。
JavaScript
```
const array = [['name', 'Chris'], ['age', 35]];
const map = new Map(array);

console.log(map.get('name')); // 'Chris'
```

这些就是 Map 的全部核心方法和属性。掌握了它们，你就能在各种场景下高效地使用 Map 来管理你的数据了。