JS `WeakMap` 实现缓存：自动垃圾回收不使用的缓存项

嘿，大家好！欢迎来到今天的 "WeakMap：缓存界的优雅绅士" 讲座。今天我们要聊聊一个经常被忽视，但绝对能让你的缓存策略瞬间高大上的利器 —— WeakMap。

开场白：缓存这件小事

在座的各位都是代码界的精英，缓存这东西肯定不陌生。简单来说，缓存就是把一些计算成本高昂的结果存起来，下次再用的时候直接拿，省时省力。但是，传统的缓存方案经常会遇到一个问题：内存泄漏。想象一下，你辛辛苦苦算出来的结果，被缓存占着茅坑不拉屎，永远不会被用到，那你的内存就遭殃了。

这时候，WeakMap 就像一位优雅的绅士，带着他的 "自动垃圾回收" 技能，闪亮登场了。

WeakMap 是个什么鬼？

WeakMap，顾名思义，是 Map 的一个 "弱" 化版本。 它的核心特点是：

• 键必须是对象： 只能用对象作为键，不能用原始类型（字符串、数字、布尔值等）。
• 弱引用： 这是最关键的一点！WeakMap 对键的引用是弱引用。这意味着，如果一个对象只被 WeakMap 引用，而没有其他强引用指向它，那么垃圾回收器（GC）就会回收这个对象。对象一旦被回收，WeakMap 中对应的键值对也会自动消失。

为什么说 WeakMap 适合做缓存？

因为 WeakMap 可以解决传统缓存的内存泄漏问题。 我们来举个例子：

let cache = new WeakMap();

function calculateSomething(obj) {
  if (cache.has(obj)) {
    console.log("从缓存中获取");
    return cache.get(obj);
  }

  console.log("计算新值");
  // 模拟耗时的计算
  let result = obj.value * 2;
  cache.set(obj, result);
  return result;
}

let myObject = { value: 10 };

// 第一次计算，存入缓存
console.log(calculateSomething(myObject)); // 输出：计算新值 20

// 第二次直接从缓存获取
console.log(calculateSomething(myObject)); // 输出：从缓存中获取 20

// 现在，我们把 myObject 的引用设为 null
myObject = null;

// 稍等片刻，等待垃圾回收器运行
// (实际开发中，你没法直接控制 GC 运行，这里只是为了演示)

// 如果我们再调用 calculateSomething， 会发生什么？
//由于myObject没有被引用，已经被垃圾回收器回收了，cache中对应的键值对也会自动消失
setTimeout(() => {
  let newObject = {value: 10}
  console.log(calculateSomething(newObject)); // 输出：计算新值 20
}, 1000);

在这个例子中，当 myObject 被设置为 null 之后，如果 myObject 没有被其他地方引用，垃圾回收器最终会回收它。 由于 cache 对 myObject 的引用是弱引用，所以 cache 中对应的键值对也会被自动移除，释放内存。

WeakMap 的 API

WeakMap 的 API 非常简单，和 Map 类似，但是少了 size 属性（因为你没法知道有多少键值对会被垃圾回收）。

方法	描述
set(key, value)	将 key (必须是对象) 和 value 关联起来。
get(key)	返回与 key 关联的值，如果 key 不存在，则返回 undefined。
has(key)	如果 key 存在，则返回 true，否则返回 false。
delete(key)	移除与 key 关联的键值对。

缓存策略进阶：更复杂的场景

WeakMap 就像一块乐高积木，可以用来构建各种复杂的缓存策略。我们来看几个例子：

1. 缓存 DOM 节点的数据

   在 Web 开发中，经常需要给 DOM 节点关联一些额外的数据。用 WeakMap 可以避免 DOM 节点被移除后，关联的数据仍然占用内存的问题。

   let elementData = new WeakMap();
   
   let myElement = document.createElement("div");
   elementData.set(myElement, { id: 123, name: "My Element" });
   
   // 当 myElement 从 DOM 树中移除后， elementData 中对应的键值对也会被自动移除
   // myElement.remove();

2. 缓存函数计算结果

   我们可以用 WeakMap 来缓存函数的计算结果，特别是当函数的参数是对象时。

   let memoizeCache = new WeakMap();
   
   function expensiveCalculation(obj) {
     if (memoizeCache.has(obj)) {
       console.log("从缓存中获取结果");
       return memoizeCache.get(obj);
     }
   
     console.log("进行计算...");
     // 模拟耗时的计算
     let result = obj.value * obj.value;
     memoizeCache.set(obj, result);
     return result;
   }
   
   let config1 = { value: 5 };
   let config2 = { value: 10 };
   
   console.log(expensiveCalculation(config1)); // 输出：进行计算... 25
   console.log(expensiveCalculation(config1)); // 输出：从缓存中获取结果 25
   console.log(expensiveCalculation(config2)); // 输出：进行计算... 100

3. 私有变量

   虽然现在有了 Symbol 和 private 字段，但 WeakMap 仍然可以用来模拟私有变量。

   let _counter = new WeakMap();
   
   class MyClass {
     constructor() {
       _counter.set(this, 0); // 初始化私有变量
     }
   
     increment() {
       let count = _counter.get(this);
       _counter.set(this, count + 1);
     }
   
     getCount() {
       return _counter.get(this);
     }
   }
   
   let instance = new MyClass();
   instance.increment();
   console.log(instance.getCount()); // 输出：1
   
   // 外部无法直接访问 _counter
   // console.log(_counter.get(instance)); // undefined

WeakMap 的局限性

WeakMap 虽然强大，但也有一些局限性：

• 键必须是对象： 这是最主要的限制。如果你需要用原始类型作为键，那就只能用 Map 了。
• 无法遍历： WeakMap 没有 keys(), values(), entries() 方法，所以你无法遍历它。这是因为你无法确定 WeakMap 中有多少键值对是有效的（未被垃圾回收）。
• 无法获取大小： 没有 size 属性。同样是因为垃圾回收的不确定性。

WeakSet：WeakMap 的好兄弟

既然提到了 WeakMap，就不得不提一下它的好兄弟 WeakSet。 WeakSet 和 Set 类似，但是它只能存储对象，并且对对象的引用是弱引用。 WeakSet 主要用于追踪哪些对象已经被处理过了，或者用于给对象打标记，而不需要担心内存泄漏。

WeakMap 与 Map 的选择：灵魂拷问

什么时候用 WeakMap，什么时候用 Map 呢？ 这是个好问题！

特性	WeakMap	Map
键的类型	必须是对象	可以是任何类型（原始类型或对象）
引用类型	弱引用	强引用
垃圾回收	当键对象没有其他强引用时，会被垃圾回收器回收，对应的键值对也会自动移除	键值对会一直存在，直到手动删除
是否可遍历	否（没有 keys(), values(), entries() 方法）	是（有 keys(), values(), entries() 方法）
用途	适合需要关联对象数据，并且希望在对象被垃圾回收时自动释放内存的场景，例如：缓存 DOM 节点的数据、缓存函数计算结果（参数是对象）、模拟私有变量	适合需要存储任意类型键值对，并且需要遍历或获取大小的场景
内存泄漏风险	较低（可以避免内存泄漏）	较高（如果键对象不再使用，但仍然被 Map 引用，会导致内存泄漏）

总结：WeakMap，你值得拥有！

WeakMap 是一个非常实用的工具，特别是在需要管理对象生命周期和避免内存泄漏的场景下。 它可以让你写出更健壮、更高效的代码。 记住，选择 WeakMap 还是 Map，关键在于你的应用场景。 如果你需要用对象作为键，并且希望在对象不再使用时自动释放内存，那么 WeakMap 绝对是你的首选。

好了，今天的 "WeakMap：缓存界的优雅绅士" 讲座就到这里。 希望大家有所收获，下次再见！ 祝大家编码愉快！