js中的内存泄漏

编程

发布日期: 2025-04-16

更新日期: 2025-04-16

文章字数: 420

阅读时长: 1 分

定义

应用程序中的内存不再被使用，但是它仍然被占用着，导致内存消耗逐渐增加，最终导致应用性能下降或卡顿崩溃。形象点描述就是
不断地往气球里吹气，但是不排气，最后导致气球炸开。虽然v8引擎中自带GC,关于GC可以看我这篇文章。了解V8 GC
但当某些对象意外存活于内存中无法被回收时，还是会导致内存持续增长

内存泄漏常见示例

1. 意外的全局变量

function sayHello() {
  text = 'say hello ~ ';
}
// text这个变量因为没有声明，他会自动变成全局变量
// 解决方法就是去声明。 let / const

2. 闭包

function developDreams() {
  const dreams = "自由";
  
  return function() {
    console.log(`我的梦想是——${dreams}`);
    // 闭包持有dreams引用,就算不再使用dreams了，但他还是会存在，而且会阻止被垃圾回收
  };
}

const dream = developDreams();

// 解决方法：及时解除引用
dream = null; // 我的梦想也空了

3. 定时器 setInterval / setTimeout

let num = [];

setInterval(() => {
  num.push(Math.random()* 100000);
}, 1000); // 每秒添加随机数

// 解决方法:
const timer = setInterval(...);
clearInterval(timer); // 组件卸载时清理

4. 时间监听

function addListener() {
  const button = document.getElementById('myButton');
  button.addEventListener('click', handleClick);
}

// 组件卸载后未移除：
function handleClick() {
  // 事件处理逻辑
}

// 解决方法：组件卸载后移除监听
button.removeEventListener('click', handleClick);