JavaScript WeakMaps/WeakSets : What consequences have "weak" references?

Question

在尝试理解 JavaScript 的 WeakMaps/WeakSets 时，我阅读了 MDN 文档。

其中写道:“WeakSet 是弱的:对集合中对象的引用被弱保留。如果没有其他对存储在 WeakSet 中的对象的引用，它们可以被垃圾回收。 ”。

全文:MDN

“它们可以被垃圾收集”是什么意思？

当我创建一个对象时。然后将其存储为WeakSet。然后将引用变量设置为null。

该对象会自动从集合中删除吗？

Answer 1

我不太确定上面的内容是否向您展示了 WeakSet 正在做什么。

所以我在这里创建了一个片段来展示它。因为从浏览器中您通常无法访问 GC，所以我已经做到了，以便它控制台记录 WeakSet，并等待您按下按钮并再次控制台日志。同时，您可以清除浏览器控制台并强制执行 GC，清除控制台的操作就像在 Chrome 控制台中记录 WeakSet 一样，最终也会保留对对象的引用。

如果您在 Chrome 浏览器中执行此操作，您应该会看到 WeakSet {{..}, {{..}}，向我们表明 WeakSet 有对 2 个对象的引用。清除控制台后，强制执行 GC，然后单击按钮。另一个 WeakSet 将被控制台记录，它应该显示 WeakSet {{..}}。基本上显示 1 个对象，证明 GC 已完成其工作并且仅保留对 objectA 的引用。

Note: In chrome to force a GC, go to the performance tab, and there is an icon that looks like a dustbin 🗑️, click this.

ps。如果您将代码片段中的 new WeakSet 更改为 new Set，并执行相同的操作，您会发现 Set 中仍然有 2 个项目。这就是 Set 和 WeakSet 之间的区别。

const ws = new WeakSet();

let objectA = {};
let objectB = {};

ws.add(objectA);
ws.add(objectB);

console.log(ws);

objectB = null;

document.querySelector("button").onclick = function () {
  console.log(ws);
}

<p>Look inside Chrome console, you should see a WeakSet, and it should have two values in there. eg. <b>WeakSet {{..}},{..}}</b></p>
<p>Now clear the console, otherwise the console will keep a referece to the weakset entries, and either wait for a while, maybe 30 seconds, or go into chrome's Performace tab and click the collect garbage icon.  After doing this, click the button below.</p>
<p>

<button>Click me after console clear and GC</button>

<p>After clicking the above button look in your console again, you should see a Weakset again, but with just one item. eg.  <b>WeakSet {{..}}</b></p>