javascript中的垃圾收集及内存泄漏

我会带着你远行 2022-06-08 03:18 198阅读 0赞

## 一、什么是内存泄漏？ ##

程序的运行需要内存。只要程序提出要求，操作系统或者运行时（runtime）就必须供给内存。  
对于持续运行的服务进程（daemon），必须及时释放不再用到的内存。否则，内存占用越来越高，轻则影响系统性能，重则导致进程崩溃。

**不再用到的内存，没有及时释放，就叫做内存泄漏（memory leak）。**

有些语言（比如 C 语言）必须手动释放内存，程序员负责内存管理。

char * buffer;
    buffer = (char*) malloc(42);
    
    // Do something with buffer
    
    free(buffer);

上面是 C 语言代码，malloc方法用来申请内存，使用完毕之后，必须自己用free方法释放内存。

这很麻烦，所以**大多数语言提供自动内存管理，减轻程序员的负担，这被称为”垃圾回收机制”（garbage collector）。**

## 二、垃圾回收机制 ##

垃圾回收机制怎么知道，哪些内存不再需要呢？

方法一：**标记清除**：这是javascript中最常用的垃圾回收方式。当变量进入执行环境是，就标记这个变量为“进入环境”。从逻辑上讲，永远不能释放进入环境的变量所占用的内存，因为只要执行流进入相应的环境，就可能会用到他们。当变量离开环境时，则将其标记为“离开环境”。  
　　垃圾收集器在运行的时候会给存储在内存中的所有变量都加上标记。然后，它会去掉环境中的变量以及被环境中的变量引用的标记。而在此之后再被加上标记的变量将被视为准备删除的变量，原因是环境中的变量已经无法访问到这些变量了。最后。垃圾收集器完成内存清除工作，销毁那些带标记的值，并回收他们所占用的内存空间。  
　　  
方法二：**“引用计数**“（reference counting）：这是不太常见的垃圾收集策略。引用计数的含义就是跟踪记录每个值被引用的次数。当声明了一个变量并将一个引用类型的值赋给该变量时，该值的引用次数就是1。如果同一个值又被赋给了另一个变量，则该值的引用次数＋1。相反，如果包含对该值引用的变量有取得了另外一个值，则该值的引用次数-1。当这个值的引用次数变为0时，则说明没有办法再访问这个值了，因而就可以将其占用的内存空间回收回来。这样，当垃圾收集器下次运行时，它就会释放那些引用次数为0的值所占用的内存。

![这里写图片描述][SouthEast]

上图中，左下角的两个值，没有任何引用，所以可以释放。

**如果一个值不再需要了，引用数却不为0，垃圾回收机制无法释放这块内存，从而导致内存泄漏。**

const arr = [1, 2, 3, 4];
    console.log('hello world');

上面代码中，数组\[1, 2, 3, 4\]是一个值，会占用内存。变量arr是仅有的对这个值的引用，因此引用次数为1。尽管后面的代码没有用到arr，它还是会持续占用内存。

如果增加一行代码，解除arr对\[1, 2, 3, 4\]引用，这块内存就可以被垃圾回收机制释放了。

let arr = [1, 2, 3, 4];
    console.log('hello world');
    arr = null;

上面代码中，arr重置为null，就解除了对\[1, 2, 3, 4\]的引用，引用次数变成了0，内存就可以释放出来了。

再看一个例子：

function　assignHandler(){ 
            var element=document.getElementById("someElement");
            element.onclick=function(){ 
                alert(element.id);
            }
        }

我们知道IE有一些部分并不是原生的javascripr对象。例如：其BOM和DOM中的对象就是使用C++以COM（Component Object Model，组件对象模型）对象的形式实现的。因此，即使IE的javascript对象时使用标记清除策略来实现的，但javascript访问的COM对象仍然是基于引用计数策略的。换句话说，在IE中，一旦涉及COM对象，就会存在引用循环问题。

同时，由于IE9之前的版本对JScript对象和COM对象使用不同的垃圾收集例程，闭包在这些版本中也会导致一些特殊的问题。具体来说，如果闭包的作用域链中保存着HTML元素，那么意味着该元素将无法被销毁。如上面例子。  
上面代创建了一个名为element元素事件处理程序的闭包，而这个闭包又创建了一个玄幻引用。由于匿名函数保存着一个队assignHandler()的活动对象的引用，因此就会导致无法减少element的引用量。只要匿名函数存在，element的引用次数至少为1，那么它所占用的内存就无法被回收。不过这个问题可以通过稍微更改下代码来解决。

function　assignHandler(){ 
            var element=document.getElementById("someElement");
            var id=element.id;
            element.onclick=function(){ 
                alert(id);
            };
            element=null;
        }

在上述代码中，通过element.id的一个副本保存在一个变量中，并且在闭包中引用该变量消除了循环引用。但仅仅这样还不能解决内存泄露的问题，必须要记住：**闭包会引用包含函数的整个活动对象**，而其中包含element。因此即使闭包不直接引用element，包含函数的活动对象中也仍然保存着一个引用。因此，有必要把element变量设置为null。这样就可以解除对DOM对象的引用，顺利减少其引用数，确保正常回收其占用的内存。

因此，并不是说有了垃圾回收机制，程序员就轻松了。你还是需要关注内存占用：**那些很占空间的值，一旦不再用到，你必须检查是否还存在对它们的引用。如果是的话，就必须手动解除引用**。

参考链接：[阮一峰：JavaScript 内存泄漏教程][JavaScript]

[SouthEast]: /images/20220608/ecdf373c5c394f2eabb461cf35464099.png
[JavaScript]: http://www.ruanyifeng.com/blog/2017/04/memory-leak.html