前言
在前端开发中，我们经常需要存储一些临时的数据集合，比如临时存储一些已经被选中的 DOM 元素，临时存储一些异步请求的结果等等。而 WeakSet 是 ES6 中引入的新的数据类型，它不同于普通的 Set，它只能存储对象引用类型的数据，而不是基本数据类型，也不会阻止存储对象被垃圾回收器回收，因此非常适合用于临时存储一些数据集合，避免内存泄漏的问题。
在 ES12 中，WeakSet 经过了一些改进，可以更加优雅地解决临时集合存储问题。
WeakSet 的基本用法
首先，我们来看一下 WeakSet 的基本用法。与 Set 类似，WeakSet 也有 add、delete、has 等方法，可以对它进行增删查操作。
-- -------------------- ---- ------- ----- -- - --- ---------- ----- ---- - - ----- ---- -- ----- ---- - - ----- ---- -- ------------- ------------- -------------------------- -- ---- ---------------- -------------------------- -- ----- -------------------------- -- ----
与 Set 不同的是，WeakSet 不能迭代，也不能获取到它的大小。
WeakSet 在临时集合存储中的应用
如何将 WeakSet 应用于临时集合存储呢？以选中 DOM 元素为例，当我们需要临时存储一些已经被选中的元素时，我们可以创建一个 WeakSet 对象，然后在每次选中元素时，将元素的引用添加到 WeakSet 中。当需要取消选中某个元素时，我们直接从 WeakSet 中删除即可。
-- -------------------- ---- -------
----- ------------ - --- ----------
-------- ----------- -
----- --- - ---------
-- ------------------------------------ -
-------
-
------------------------------
----------------------
-
-------- ------------- -
----- --- - ---------
-- ------------------------------------- -
-------
-
---------------------------------
-------------------------
-这样，我们就可以安全地存储一些临时选中的 DOM 元素，而不需要担心内存泄漏的问题。
同样的道理，我们也可以将 WeakSet 应用于存储临时的异步请求结果。当一个异步请求完成后，我们将其结果存储到 WeakSet 中，这样在后续的操作中，我们就可以直接从 WeakSet 中查找是否存在对应的结果，而不需要再次发起异步请求。
-- -------------------- ---- -------
----- ----- - --- ----------
----- -------- ----------- -
----- ---- - ----- ----------------------------------
----------------
------ -----
-
----- -------- --------- -
--- -----
--- ------ - -- ------ -
---- - --
-
-- ------- -
---- - ----- ------------
-
------ -----
-这样，我们就可以安全地存储一些临时的异步请求结果，避免重复请求和内存泄漏的问题。
总结
在 ES12 中，WeakSet 经过了一些改进，可以更加优雅地解决临时集合存储问题。它不同于普通的 Set，它只能存储对象引用类型的数据，而且不会阻止存储对象被垃圾回收器回收，因此非常适合用于临时存储一些数据集合，避免内存泄漏的问题。在实际的开发中，我们可以根据自己的需要，灵活应用 WeakSet 解决临时集合存储的问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/647d9e0c968c7c53b0869571
