JavaScript中如何避免内存泄漏？

在JavaScript中避免内存泄漏的核心方法是清除无用引用，包括定时器、闭包变量、DOM引用和事件监听器，同时结合性能工具进行监控和优化。 以下是具体措施和示例：

定时器（如setInterval）和未释放的回调函数会持续占用内存，尤其在组件卸载或页面跳转时未清除会导致泄漏。

• 错误示例：未清除的定时器持续运行，占用内存。let timerId = setInterval(() => { console.log('定时器未清除');}, 1000);
• 正确做法：在不需要时立即清除定时器。let timerId = setInterval(() => { console.log('定时器运行中');}, 1000);// 清除定时器（例如在组件卸载时）clearInterval(timerId);
• 场景：实时数据监控系统中，未清除的定时器会导致内存持续增长，最终崩溃。清除后性能显著提升。

闭包会长期持有外部变量引用，若变量占用内存较大（如数组、对象），需手动释放。

• 错误示例：闭包长期持有大数组引用，无法被垃圾回收。function outerFunction() { let largeArray = new Array(1000000).fill(0); return function innerFunction() { console.log(largeArray[0]); // largeArray未被释放 };}let closure = outerFunction();closure();
• 正确做法：在闭包内手动释放大对象。function outerFunction() { let largeArray = new Array(1000000).fill(0); return function innerFunction() { console.log(largeArray[0]); largeArray = null; // 手动释放 };}let closure = outerFunction();closure();
• 场景：复杂交互系统中，闭包导致的内存泄漏会使响应变慢，优化后问题解决。

DOM元素被移除后，若仍有JavaScript变量引用它，会导致无法回收。

• 错误示例：DOM引用未释放，元素无法被垃圾回收。let elements = document.querySelectorAll('.my-class');let elementArray = Array.from(elements); // 引用未清除
• 正确做法：不再需要时释放引用。let elements = document.querySelectorAll('.my-class');let elementArray = Array.from(elements);// 释放引用（例如在组件卸载时）elementArray = null;
• 场景：大型单页应用中，未释放的DOM引用导致内存泄漏，清理后性能提升。

事件监听器未移除时，即使DOM元素被删除，监听器仍会占用内存。

• 错误示例：事件监听器未移除，持续占用内存。let button = document.getElementById('myButton');button.addEventListener('click', function onClick() { console.log('Button clicked');});
• 正确做法：在元素移除或不再需要时移除监听器。let button = document.getElementById('myButton');let onClick = function() { console.log('Button clicked'); button.removeEventListener('click', onClick); // 移除自身};button.addEventListener('click', onClick);
• 场景：电商网站中，页面切换时未移除旧监听器导致泄漏，优化后问题解决。

• 使用WeakMap和WeakSet：这些数据结构对键的引用为弱引用，不会阻止垃圾回收，适合存储DOM引用或临时对象。let weakMap = new WeakMap();let domElement = document.getElementById('example');weakMap.set(domElement, 'some data'); // 不会阻止domElement被回收
• 内存分析工具：使用Chrome DevTools的Memory面板进行堆快照分析，定位泄漏源头。
• 定期检查和清理：在代码中主动检查无用引用（如组件卸载时清理定时器、事件监听器等）。

避免JavaScript内存泄漏需从代码层面管理引用关系，核心原则是确保无用对象能被垃圾回收。通过清除定时器、手动释放闭包变量、及时释放DOM引用和移除事件监听器，结合工具监控，可显著提升应用性能和稳定性。