在前端开发中，我们经常需要处理键值对，比如将一些数据存储在一个对象中，但是对象的键只能是字符串类型，这就限制了它的使用范围。为了解决这个问题，ES6 新增了两个数据结构：Map 和 WeakMap。本文将详细介绍这两个数据结构的使用方法和区别。
Map
Map 是一个键值对的集合，其中的键和值可以是任意类型的数据，不仅仅限于字符串类型。可以将 Map 看作是一个更完善的对象，它提供了一些对象所不具备的方法，如 set()、get()、has()、delete() 等。
基本使用
创建 Map 对象可以使用 new Map()，也可以通过传入一个数组来初始化。以下是一个示例：
-- -------------------- ---- ------- -- --- --- -- ----- --- - --- ------ -- ---------- --- -- ----- ---- - --- ----- -------- ------- ------- ---- ---------- -------- ---
向 Map 对象中添加键值对可以使用 set() 方法，获取值可以使用 get() 方法，判断是否存在某个键可以使用 has() 方法，删除某个键可以使用 delete() 方法，清空 Map 对象可以使用 clear() 方法。以下是一个示例：
-- -------------------- ---- ------- ----- --- - --- ------ -- ----- --------------- ------- -------------- ---- ----------------- -------- -- --- ----------------------------- -- --- -- --------- ---------------------------- -- ---- -- ----- --------------------- -- -- --- -- ------------ ---------------------- -- -
迭代器
Map 对象提供了三个迭代器，分别是 keys()、values()、entries()。其中 keys() 返回的是所有键的迭代器，values() 返回的是所有值的迭代器，entries() 返回的是所有键值对的迭代器。以下是一个示例：
-- -------------------- ---- ------- ----- --- - --- ----- -------- ------- ------- ---- ---------- -------- --- -- ----- --- ------ --- -- ----------- - ----------------- - -- ----- --- ------ ----- -- ------------- - ------------------- - -- ------- --- ------ ----- ------ -- -------------- - -------------------- ----------- -
Map 与对象的区别
Map 对象与对象有很多相似之处，但也有一些区别。以下是它们之间的主要区别：
- Map 对象的键可以是任意数据类型，而对象的键只能是字符串类型。
- Map 对象的键值对是有序的，而对象的键值对是无序的。
- Map 对象的键值对个数可以通过
size属性获取，而对象的键值对个数需要手动计算。
实战应用
Map 对象可以用于缓存数据，可以避免重复计算。以下是一个示例：
-- -------------------- ---- -------
----- ----- - --- ------
-------- ------------ -
-- -- -- -- -
------ --
-
-- -------------- -
------ -------------
-
----- ------ - ----------- - -- - ----------- - ---
------------ --------
------ -------
-WeakMap
WeakMap 是 Map 的一种特殊形式，它的键必须是对象，值可以是任意类型的数据。WeakMap 的特点是它的键是弱引用，当键对象被垃圾回收时，对应的键值对也会被自动删除。因此，WeakMap 可以用于存储临时数据，避免内存泄漏。
基本使用
创建 WeakMap 对象可以使用 new WeakMap()，不支持传入数组来初始化。以下是一个示例：
const weakMap = new WeakMap();
向 WeakMap 对象中添加键值对可以使用 set() 方法，获取值可以使用 get() 方法，判断是否存在某个键可以使用 has() 方法，删除某个键可以使用 delete() 方法。以下是一个示例：
-- -------------------- ---- ------- ----- ------- - --- ---------- -- ----- ----- --- - --- ---------------- --------- -- --- ------------------------------ -- ----- -- --------- ------------------------------ -- ---- -- ----- --------------------
WeakMap 的限制
由于 WeakMap 的键是弱引用，因此它有一些限制：
- WeakMap 的键必须是对象，不能是基本数据类型。
- WeakMap 的键不能被枚举，因此不能使用
keys()、values()、entries()、forEach()等方法。 - WeakMap 的键不能被直接获取，因此不能使用
size属性。
实战应用
WeakMap 对象可以用于存储私有数据，避免被外部访问。以下是一个示例：
-- -------------------- ---- -------
----- ----------- - --- ----------
----- ------ -
----------------- ---- -
--------------------- - ----- --- ---
-
--------- -
------ ---------------------------
-
-------- -
------ --------------------------
-
-
----- ------ - --- ------------- ----
------------------------------ -- ---
----------------------------- -- --
------------------------------------- -- ---------总结
Map 和 WeakMap 是 ES6 中新增的两个数据结构，它们可以用于处理键值对。Map 对象的键可以是任意数据类型，而 WeakMap 对象的键必须是对象；Map 对象的键值对是有序的，而 WeakMap 对象的键值对是无序的；Map 对象的键值对个数可以通过 size 属性获取，而 WeakMap 对象的键值对个数不能直接获取。Map 对象可以用于缓存数据，WeakMap 对象可以用于存储私有数据。在实际开发中，根据不同的场景选择合适的数据结构，可以提高代码的可读性和性能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/657ab21dd2f5e1655d522abc