WeakMap 是什么?它和 Map 有什么区别?

70 阅读1分钟

WeakMap - JavaScript | MDN

Map - JavaScript | MDN

  1. WeakMap 允许将数据与对象相关联,而不阻止键对象被垃圾回收,即使值引用了键。
  2. Map 对象保存键值对,并且能够记住键的原始插入顺序。任何值(对象或者原始值)都可以作为键或值。

核心相同点:都是 {key, value} 的结构对象。
不同点:WeakMap 的 key 必须是对象(或非全局注册的符号),且是弱引用的。

示例:虽然 obj 已经不存在任何引用了,但是它并没有被回收,依然存在于 Map 实例中。这就证明了 Map 是强引用的,哪怕 obj 手动设为了 null,但是它依然存在于 Map 实例中

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Map强引用 与 WeakMap弱引用</title>
  </head>
  <body>
    <script>
      // target 对象
      let obj = {
        name: '张三',
        age: 18,
      };
      // 声明 Map 对象
      const map = new Map();
      // 保存键值对
      map.set(obj, 'value');
      // 把 obj 置空
      obj = null;
      // 虽然 obj 置空了,但是 map 中依然有 obj 的引用, 所以 map 不会被回收
      console.log(map);

      // ------------------------------
      let obj2 = {
        name: '李四',
        age: 20,
      };
      // WeakMap 弱引用
      const weakMap = new WeakMap();
      // 保存键值对
      weakMap.set(obj2, 'value');
      // 把 obj2 置空
      obj2 = null;
      // 虽然 obj2 置空了,但是 weakMap 中没有 obj2 的引用, 所以 weakMap 会被回收
      console.log(weakMap);
    </script>
  </body>
</html>