JavaScript 中的 Map 完全指南
引言
在 JavaScript 中,Map
是一种用于存储键值对的数据结构,具有灵活的键类型和丰富的方法。相较于传统的对象(Object),Map
提供了更高效的键值对操作方式,特别适合处理大量数据和需要频繁操作键值对的场景。本文将详细介绍 Map
的创建、常用方法、迭代方式,并探讨它与对象的区别和实际应用场景。
1. 创建 Map
使用 new Map()
来创建一个空的 Map
。
1const map = new Map();
也可以在创建时初始化 Map
,传入一个包含键值对的数组:
1const map = new Map([
2 ["name", "Alice"],
3 ["age", 25]
4]);
5console.log(map);
2. Map
和对象的对比
在学习 Map
的基本操作之前,我们先来看一下 Map
与传统对象的区别。
特性 | Map | 对象 |
---|---|---|
键的类型 | 任何类型(字符串、对象、函数等) | 只能是字符串或符号 |
插入顺序 | 保持插入顺序 | 不保证插入顺序 |
键值对数量 | size 属性 | 手动计算(Object.keys().length ) |
原型链污染 | 无 | 有,继承 Object.prototype |
适用场景 | 频繁操作键值对,大量数据 | 小规模键值对或需要方法时 |
通过对比可以看出,Map
在键的类型、插入顺序的保持以及键值对操作的效率上,都有显著的优势。
3. Map
的常用方法
3.1 set(key, value)
用于向 Map
添加一个键值对。如果键已经存在,set
会更新其值。
1map.set("name", "Bob");
2map.set("age", 30);
3console.log(map);
3.2 get(key)
获取指定键的值,如果键不存在,返回 undefined
。
1console.log(map.get("name"));
2console.log(map.get("gender"));
3.3 has(key)
检查 Map
中是否存在指定的键,返回 true
或 false
。
1console.log(map.has("name"));
2console.log(map.has("gender"));
3.4 delete(key)
删除指定的键值对,返回 true
如果成功删除,否则返回 false
。
1map.delete("age");
2console.log(map);
3.5 clear()
清空 Map
,删除所有键值对。
1map.clear();
2console.log(map);
3.6 size
返回 Map
中键值对的数量。
1map.set("name", "Alice");
2map.set("age", 25);
3console.log(map.size);
4. Map
的迭代方法
Map
支持多种迭代方法,可以轻松遍历其中的键值对。
4.1 forEach(callback)
遍历 Map
中的每一个键值对,callback
函数接受三个参数:值、键、Map 本身。
1map.forEach((value, key) => {
2 console.log(`${key}: ${value}`);
3});
4.2 keys()
返回 Map
中所有键的迭代器(Iterator
),可以用 for...of
来遍历。
1for (let key of map.keys()) {
2 console.log(key);
3}
4.3 values()
返回 Map
中所有值的迭代器(Iterator
)。
1for (let value of map.values()) {
2 console.log(value);
3}
4.4 entries()
返回 Map
中所有键值对的迭代器,每个键值对会以 [key, value]
的形式返回。
1for (let entry of map.entries()) {
2 console.log(entry);
3}
4.5 使用 for...of
遍历 Map
可以直接用 for...of
遍历 Map
,默认会调用 entries()
方法,因此会返回 [key, value]
的数组。
1for (let [key, value] of map) {
2 console.log(`${key}: ${value}`);
3}
5. Map
的应用场景
Map
是一种适合存储键值对的结构,尤其适用于以下场景:
-
需要使用非字符串类型的键:对象的键只能是字符串或符号,而
Map
可以使用任意数据类型作为键,比如对象、函数等。1const objKey = { id: 1 }; 2const map = new Map(); 3map.set(objKey, "Object as key"); 4console.log(map.get(objKey));
-
需要频繁操作键值对:
Map
在键值对的查找、插入、删除操作上比对象性能更好,适合在频繁操作键值对的场景下使用。 -
需要保持插入顺序:
Map
会按照插入的顺序存储键值对,因此在遍历时顺序是固定的,而对象则不保证插入顺序。 -
避免原型链污染:对象的键可能会受
Object.prototype
影响,而Map
没有原型链污染问题,可以安全地存储任意键。
6. 使用 Map
统计字母出现的次数
我们可以通过一个例子来比较使用 Map
和不使用 Map
的差别。假设我们有一个字符串,需要统计其中每个字母出现的次数。Map
非常适合这种键值对存储的场景。
方法 1:不用 Map
,使用普通对象
1function countLettersWithObject(str) {
2 const letterCounts = {};
3
4 for (let letter of str) {
5 if (letterCounts[letter]) {
6 letterCounts[letter]++;
7 } else {
8 letterCounts[letter] = 1;
9 }
10 }
11
12 return letterCounts;
13}
14
15const result = countLettersWithObject("hello world");
16console.log(result);
方法 2:使用 Map
1function countLettersWithMap(str) {
2 const letterCounts = new Map();
3
4 for (let letter of str) {
5 if (letterCounts.has(letter)) {
6 letterCounts.set(letter, letterCounts.get(letter) + 1);
7 } else {
8 letterCounts.set(letter, 1);
9 }
10 }
11
12 return letterCounts;
13}
14
15const resultMap = countLettersWithMap("hello world");
16console.log(resultMap);
7. WeakMap
简介
WeakMap
是 Map
的一种特殊类型,它的键必须是对象,且是弱引用(即不会阻止对象被垃圾回收)。如果某个对象在其他地方不再被引用,那么即使它是 WeakMap
的键,也会被垃圾回收,这样可以防止内存泄漏。
WeakMap
的特点
- 只接受对象作为键,不支持基本类型。
- 键是弱引用,不会阻止垃圾回收。
- 没有
size
属性、clear
方法和遍历方法(forEach
、keys
、values
、entries
),因此不能遍历WeakMap
。
使用场景
WeakMap
通常用于私有属性或私有数据的存储,不希望这些数据影响垃圾回收。它适用于对象间的临时映射关系,且在数据无需遍历的情况下使用。
1const weakMap = new WeakMap();
2let obj = { id: 1 };
3
4weakMap.set(obj, "some value");
5console.log(weakMap.get(obj));
6
7obj = null;
总结
Map
是一种强大的键值对数据结构,具有灵活的键类型支持、保持插入顺序、丰富的内置方法等优势,适合存储和操作大量键值对。而 WeakMap
则是一种针对对象键的弱引用 Map
,在特定场景中帮助管理内存