JavaScript 中的 Map

阿门ama

已于 2025-04-18 13:51:26 修改

阅读量735

点赞数 19

文章标签： javascript 开发语言 ecmascript

于 2025-04-18 13:17:28 首次发布

本文链接：https://blog.csdn.net/m0_49997465/article/details/147326174

版权

Map 是 JavaScript 中的一种内置对象，它在 ES6（ECMAScript 2015）中被引入，提供了一种新的方式来存储键值对。与传统的对象 ({}) 存储键值对不同，Map 有一些特别的特性，尤其是关于键值类型和插入顺序的保证。

1. Map 的作用：

Map 用来存储键值对，每一对数据是由键和值组成。Map 提供了一些特别的优势和灵活性：

键的类型：在对象中，键只能是字符串或 Symbol 类型，但在 Map 中，键可以是任何类型，包括对象、函数、甚至是 NaN。这使得 Map 更加灵活。
插入顺序：Map 保证键值对的插入顺序，因此我们可以根据插入顺序来遍历 Map。而对象的键是无序的，无法保证插入顺序。
高效的性能：Map 在添加、删除、查找键值对时通常比对象更高效，尤其是在大量操作的情况下。
有内置的便利方法：Map 提供了一些内置的方法，可以方便地操作键值对（例如，set、get、has、delete、clear 等）。

2. 基础用法：

1) 创建 Map

可以通过 new Map() 来创建一个空的 Map，或者通过传入一个二维数组来初始化 Map。

let map = new Map();
//或者
let map = new Map([
  ['key1', 'value1'],
  ['key2', 'value2']
]);

2) 设置键值对 (set)

使用 set() 方法将一个键值对添加到 Map 中。如果键已存在，set() 会更新该键对应的值。

let map = new Map();
map.set('name', 'Alice');
map.set('age', 30);
console.log(map);  // Map(2) { 'name' => 'Alice', 'age' => 30 }

3) 获取值 (get)

使用 get() 方法根据键来获取对应的值。如果该键不存在，get() 返回 undefined。

let map = new Map();
map.set('name', 'Alice');
console.log(map.get('name'));  // 输出: 'Alice'
console.log(map.get('age'));   // 输出: undefined

4) 检查键是否存在 (has)

使用 has() 方法来检查 Map 中是否存在某个键。

let map = new Map();
map.set('name', 'Alice');
console.log(map.has('name'));  // 输出: true
console.log(map.has('age'));   // 输出: false

5) 删除键值对 (delete)

使用 delete() 方法根据键删除对应的键值对。

let map = new Map();
map.set('name', 'Alice');
map.delete('name');
console.log(map.has('name'));  // 输出: false

6) 清空 Map (clear)

使用 clear() 方法删除 Map 中的所有键值对。

let map = new Map();
map.set('name', 'Alice');
map.set('age', 30);
map.clear();
console.log(map.size);  // 输出: 0 (清空了 Map)

7) 遍历 Map

Map 提供了几种方法来遍历其键值对。

使用 forEach() 方法：

let map = new Map([
  ['name', 'Alice'],
  ['age', 30]
]);

map.forEach((value, key) => {
  console.log(key, value);
});
// 输出:
// name Alice
// age 30

使用 for...of 循环遍历：遍历 Map 时，for...of 循环会返回一个数组形式的键值对。

let map = new Map([
  ['name', 'Alice'],
  ['age', 30]
]);

for (let [key, value] of map) {
  console.log(key, value);
}
// 输出:
// name Alice
// age 30

使用 keys()、values() 和 entries()：
- keys() 返回一个包含所有键的迭代器。
- values() 返回一个包含所有值的迭代器。
- entries() 返回一个包含所有键值对的迭代器（Map 默认是通过 entries() 方法遍历的）。

let map = new Map([
  ['name', 'Alice'],
  ['age', 30]
]);

console.log([...map.keys()]);   // 输出: ['name', 'age']
console.log([...map.values()]); // 输出: ['Alice', 30]
console.log([...map.entries()]); // 输出: [['name', 'Alice'], ['age', 30]]

3.Map 与 Object 的比较

特性	`Map`	`Object`
键的类型	可以是任何类型（包括对象、函数、数字等）	只能是字符串或 `Symbol` 类型
插入顺序	保持插入顺序	不保证顺序（老版本的 JavaScript 对象是无序的，现代版本的 JavaScript 也有顺序保证）
性能	更高效的查找、插入和删除	适用于小规模数据，不适合频繁操作大规模键值对
默认键	没有默认键	有 `Object.prototype` 中的默认键（例如 `hasOwnProperty`）
迭代方式	支持直接迭代、`forEach()`、`keys()`、`values()`	不支持直接迭代，必须手动迭代 `Object.keys()`