前端小白红宝书之旅：垃圾回收（二）
2023-12-06 23:56:54
前言
在上篇文章中，我们简单聊了下 js 中的原始值与引用值，以及传递参数。本篇文章我们看一看 js 的垃圾回收机制，以及在实际开发中，可能出现的内存泄漏的情况，以及克制内存泄漏手段。
JavaScript 垃圾回收主要策略
- 标记清除
标记清除是 JavaScript 垃圾回收最常用的策略之一。它通过两个步骤来完成：
- 标记阶段：垃圾回收器会遍历内存中的所有对象，并标记那些不再被引用的对象。
- 清除阶段：垃圾回收器会释放所有被标记的对象所占用的内存空间。
标记清除算法的优点是它非常简单高效，并且可以很好地处理循环引用。但是，它的缺点是它可能会导致内存碎片，从而降低 JavaScript 的性能。
- 引用计数
引用计数是一种更简单的垃圾回收策略。它通过跟踪每个对象被引用的次数来确定哪些对象不再被使用。当一个对象的引用计数为 0 时，它就会被垃圾回收器释放。
引用计数算法的优点是它非常高效，并且不会导致内存碎片。但是，它的缺点是它无法处理循环引用。
- 弱引用
弱引用是一种特殊的引用，它不会阻止对象被垃圾回收。当一个对象只有弱引用时，垃圾回收器可以随时释放它的内存空间。
弱引用的优点是它可以避免循环引用导致的内存泄漏。但是，它的缺点是它可能会导致对象在不应该被释放时被释放。
在 JavaScript 中避免内存泄漏
在 JavaScript 中，内存泄漏通常是由以下原因引起的：
- 闭包
- 事件监听器
- 全局变量
闭包
闭包是指内部函数可以访问外部函数的变量。当外部函数返回后，内部函数仍然可以访问这些变量，即使这些变量已经不在作用域内了。这可能会导致内存泄漏，因为这些变量无法被垃圾回收器释放。
为了避免闭包导致的内存泄漏，可以将内部函数声明为箭头函数。箭头函数不会创建自己的作用域，因此它无法访问外部函数的变量。
事件监听器
当一个元素添加了事件监听器后，浏览器就会为该元素创建一个引用。如果这个元素被删除了，但事件监听器仍然存在，就会导致内存泄漏。
为了避免事件监听器导致的内存泄漏，可以显式地移除事件监听器。例如：
const element = document.getElementById('my-element');
element.addEventListener('click', () => {
// Do something
});
element.removeEventListener('click', () => {
// Do something
});
全局变量
全局变量是指在全局作用域中声明的变量。全局变量可以被任何函数访问，因此很容易导致内存泄漏。
为了避免全局变量导致的内存泄漏，可以将全局变量声明为局部变量。例如：
function myFunction() {
const myVariable = 'Hello, world!';
// Do something with myVariable
}
在上面的示例中，myVariable 是一个局部变量，它只在 myFunction 函数内有效。当 myFunction 函数返回后，myVariable 就会被释放，从而不会导致内存泄漏。
结论
JavaScript 垃圾回收机制是一个复杂的话题，但它对于理解 JavaScript 的运行时行为非常重要。通过了解 JavaScript 垃圾回收的主要策略，以及如何在实际开发中识别和防止内存泄漏，可以帮助我们写出更高质量的代码。
