一、內(nèi)存泄漏是什么？

內(nèi)存泄漏（Memory leak）是再計算機科學(xué)中，由于疏忽或錯誤造成程序未能釋放已經(jīng)不再使用的內(nèi)存。

并非指內(nèi)存在物理上的消失，而是應(yīng)用程序分配某段內(nèi)存后，由于設(shè)計錯誤，導(dǎo)致在釋放該段內(nèi)存之前就失去了對該段內(nèi)存的控制，從而造成了內(nèi)存的浪費。

程序的運行需要內(nèi)存。只要程序提出要求，操作系統(tǒng)或者運行時就必須供給內(nèi)存。

對于持續(xù)運行的服務(wù)進程，必須及時釋放不再用到的內(nèi)存。否則，內(nèi)存占用越來越高，輕則影響系統(tǒng)性能，重則導(dǎo)致進程崩潰。

在C語言中，因為是手動管理內(nèi)存，內(nèi)存泄露是經(jīng)常出現(xiàn)的事情。

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

上面是 C 語言代碼，malloc方法用來申請內(nèi)存，使用完畢之后，必須自己用free方法釋放內(nèi)存。

這很麻煩，所以大多數(shù)語言提供自動內(nèi)存管理，減輕程序員的負擔(dān)，這被稱為"垃圾回收機制"

二、垃圾回收機制

Javascript 具有自動垃圾回收機制（GC：Garbage Collecation），也就是說，執(zhí)行環(huán)境會負責(zé)管理代碼執(zhí)行過程中使用的內(nèi)存

原理：垃圾收集器會定期（周期性）找出那些不在繼續(xù)使用的變量，然后釋放其內(nèi)存

通常情況下有兩種實現(xiàn)方式：

• 標記清除
• 引用計數(shù)

1、標記清除

JavaScript最常用的垃圾收回機制

當(dāng)變量進入執(zhí)行環(huán)境是，就標記這個變量為“進入環(huán)境“。進入環(huán)境的變量所占用的內(nèi)存就不能釋放，當(dāng)變量離開環(huán)境時，則將其標記為“離開環(huán)境“

垃圾回收程序運行的時候，會標記內(nèi)存中存儲的所有變量。然后，它會將所有在上下文中的變量，以及被在上下文中的變量引用的變量的標記去掉

在此之后再被加上標記的變量就是待刪除的了，原因是任何在上下文中的變量都訪問不到它們了

隨后垃圾回收程序做一次內(nèi)存清理，銷毀帶標記的所有值并收回它們的內(nèi)存

代碼如下（示例）：

var m = 0,n = 19 // 把 m,n,add() 標記為進入環(huán)境。
add(m, n) // 把 a, b, c標記為進入環(huán)境。
console.log(n) // a,b,c標記為離開環(huán)境，等待垃圾回收。
function add(a, b) {
  a++
  var c = a + b
  return c
}

2、引用計數(shù)

語言引擎有一張"引用表"，保存了內(nèi)存里面所有的資源（通常是各種值）的引用次數(shù)。如果一個值的引用次數(shù)是0，就表示這個值不再用到了，因此可以將這塊內(nèi)存釋放

如果一個值不再需要了，引用數(shù)卻不為0，垃圾回收機制無法釋放這塊內(nèi)存，從而導(dǎo)致內(nèi)存泄漏

代碼如下（示例）：

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

上面代碼中，數(shù)組[1, 2, 3, 4]是一個值，會占用內(nèi)存。變量arr是僅有的對這個值的引用，因此引用次數(shù)為1。盡管后面的代碼沒有用到arr，它還是會持續(xù)占用內(nèi)存。

如果需要這塊內(nèi)存被垃圾回收機制釋放，只需要再次將arr設(shè)置為null，就解除了對數(shù)組[1,2,3,4]的引用，引用次數(shù)變?yōu)?0，就被垃圾回收了。

小結(jié)

有了垃圾回收機制，不代表不用關(guān)注內(nèi)存泄露。那些很占空間的值，一旦不再用到，需要檢查是否還存在對它們的引用。如果是的話，就必須手動解除引用。

三、常見的內(nèi)存泄漏的情況

1、意外的全局變量

// 不設(shè)置定義變量的方法默認為var
function foo(arg) {
? ? bar = "this is a hidden global variable";
}
// 另一種意外的全局變量可能由 this 創(chuàng)建：
function foo() {
? ? this.variable = "potential accidental global";
}
// foo 調(diào)用自己，this 指向了全局對象（window）
foo();

上述使用嚴格模式，可以避免意外的全局變量。

2、定時器造成的內(nèi)存泄露

var someResource = getData();
setInterval(function() {
    var node = document.getElementById('Node');
    if(node) {
        // 處理 node 和 someResource
        node.innerHTML = JSON.stringify(someResource));
    }
}, 1000);

如果id為Node的元素從DOM中移除，該定時器仍會存在，同時，因為回調(diào)函數(shù)中包含對someResource的引用，定時器外面的someResource也不會被釋放

3、閉包

function bindEvent() {
  var obj = document.createElement('XXX');
  var unused = function () {
    console.log(obj, '閉包內(nèi)引用obj obj不會被釋放');
  };
  obj = null; // 解決方法
}

維持函數(shù)內(nèi)局部變量，使其得不到釋放

4、沒有清理對DOM元素的引用

const refA = document.getElementById('refA');
document.body.removeChild(refA); // dom刪除了
console.log(refA, 'refA'); // 但是還存在引用能console出整個div 沒有被回收
refA = null;
console.log(refA, 'refA'); // 解除引用

5、事件監(jiān)聽（addEventListener）

包括使用事件監(jiān)聽addEventListener監(jiān)聽的時候，在不監(jiān)聽的情況下使用removeEventListener取消對事件監(jiān)聽

總結(jié)

到此這篇關(guān)于淺談JavaScript中內(nèi)存泄漏的幾種情況的文章就介紹到這了,更多相關(guān)JavaScript 內(nèi)存泄漏內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論