JavaScript垃圾回收器未清理对象，内存泄漏问题求助

兄弟，我太懂这种翻遍Stack Overflow、谷歌搜爆相关文章，还是搞不定内存泄漏的挫败感了！结合你描述的演示场景，我来帮你捋捋可能的问题点和排查方向：

先明确你的预期逻辑（完全合理） #

• 页面加载时记录基础内存占用
• 调用go()后内存因创建对象上升
• 点击元素后，全局作用域里的对象应该被移除，内存能被GC回收

为什么Chrome手动GC后内存没释放？ #

大概率是引用链没彻底切断，或者存在隐藏的残留引用，给你几个具体的排查和解决步骤：

1. 用Chrome DevTools Memory面板精准定位

这是排查内存泄漏的核心工具，别光靠猜：

• 先拍初始Heap快照（页面刚加载完成时）
• 调用go()后拍第二次快照
• 点击元素、手动触发GC后拍第三次快照
• 对比三次快照，搜索你创建的对象类型（比如自定义的类名或对象特征），看哪些对象还在存活，查看它们的引用链（DevTools会显示是谁在持有这个对象的引用）

2. 彻底清理全局对象的引用

如果你是把对象挂在window上，别只做window.xxx = null，最好用delete window.xxx彻底移除这个属性：

// 错误示例：只是赋值null，window上的属性还存在，可能有隐式引用
window.myData = null;

// 正确示例：彻底删除全局属性，切断引用
delete window.myData;

如果是用全局变量存储，要把变量也设为null，同时确保没有其他地方引用它。

3. 检查事件监听是否残留

你给元素加了点击事件，一定要记得解绑！尤其是用命名函数绑定的（匿名函数没法解绑，会直接导致内存泄漏）：

// 先把事件处理函数存起来
let clickHandler = function() {
  // 清理逻辑
  globalData = null;
  // 解绑事件！
  document.body.removeEventListener('click', clickHandler);
  clickHandler = null;
};

// 绑定事件
document.body.addEventListener('click', clickHandler);

如果元素被移除了，也要先解绑事件再移除，否则元素和对应的事件闭包会一直留在内存里。

4. 警惕闭包陷阱

go()函数内部如果创建了闭包（比如内部函数引用了外部的全局对象），哪怕你把全局对象设为null，闭包可能还拿着它的引用。检查一下你的代码里有没有这种情况：

function go() {
  let bigData = { /* 大对象 */ };
  // 这个内部函数引用了bigData，形成闭包
  document.body.addEventListener('click', function() {
    // 如果这里没彻底清理bigData，闭包会一直持有引用
    bigData = null;
  });
}

这种情况最好把事件处理函数抽成命名函数，方便解绑和清理。

总结 #

内存泄漏的本质就是存在未被释放的引用链，别光靠经验猜，用DevTools的Memory面板对着快照找存活对象的引用来源，很快就能定位到问题！

内容的提问来源于stack exchange，提问作者Josh