JavaScript 記憶體回收機制分析_javascript技巧

在公司經常會聽到大牛們討論時說道記憶體泄露神馬的，每每都驚羨不已，最近精力主要用在了Web 開發上，讀了一下《JavaScript進階程式設計》（書名很唬人，實際作者寫的特別好，由淺入深）瞭解了一下JavaScript記憶體回收機制，對記憶體泄露有了一定的認識。

和C#、Java一樣JavaScript有自動記憶體回收機制，也就是說執行環境會負責管理代碼執行過程中使用的記憶體，在開發過程中就無需考慮記憶體配置及無用記憶體的回收問題了。JavaScript記憶體回收的機制很簡單：找出不再使用的變數，然後釋放掉其佔用的記憶體，但是這個過程不是時時的，因為其開銷比較大，所以記憶體回收行程會按照固定的時間間隔周期性的執行。

變數生命週期

有同學看了上面就會問了，什麼叫不再使用的變數？不再使用的變數也就是生命週期結束的變數，當然只可能是局部變數，全域變數的生命週期直至瀏覽器卸載頁面才會結束。局部變數只在函數的執行過程中存在，而在這個過程中會為局部變數在棧或堆上分配相應的空間，以儲存它們的值，然後再函數中使用這些變數，直至函數結束（閉包中由於內建函式的原因，外部函數並不能算是結束，瞭解閉包可以看看 JavaScript範圍鏈，JavaScript 閉包究竟是什麼）。

一旦函數結束，局部變數就沒有存在必要了，可以釋放它們佔用的記憶體。貓和很簡單的工作，為什麼會有很大開銷呢？這僅僅是記憶體回收的冰山一角，就像剛剛提到的閉包，貌似函數結束了，其實還沒有，記憶體回收行程必須那個變數遊泳，那個變數沒用，對於不再有用的變數打上標記，以備將來回收。用於標記無用的策略有很多，常見的有兩種方式

標記清除（mark and sweep）

這是JavaScript最常見的記憶體回收方式，當變數進入執行環境的時候，比如函數中聲明一個變數，記憶體回收行程將其標記為“進入環境”，當變數離開環境的時候（函數執行結束）將其標記為“離開環境”。至於怎麼標記有很多種方式，比如特殊位的反轉、維護一個列表等，這些並不重要，重要的是使用什麼策略，原則上講不能夠釋放進入環境的變數所佔的記憶體，它們隨時可能會被調用的到。

記憶體回收行程會在啟動並執行時候給儲存在記憶體中的所有變數加上標記，然後去掉環境中的變數以及被環境中變數所引用的變數（閉包），在這些完成之後仍存在標記的就是要刪除的變數了，因為環境中的變數已經無法訪問到這些變數了，然後記憶體回收行程相會這些帶有標記的變數機器所佔空間。

大部分瀏覽器都是使用這種方式進行記憶體回收，區別在於如何標記及廢棄項目收集間隔而已，只有低版本IE，不出所料，又是IE。。。

引用計數(reference counting)

在低版本IE中經常會出現記憶體泄露，很多時候就是因為其採用引用計數方式進行記憶體回收。引用計數的策略是追蹤記錄每個值被使用的次數，當聲明了一個變數並將一個參考型別賦值給該變數的時候這個值的引用次數就加1，如果該變數的值變成了另外一個，則這個值得引用次數減1，當這個值的引用次數變為0的時候，說明沒有變數在使用，這個值沒法被訪問了，因此可以將其佔用的空間回收，這樣記憶體回收行程會在啟動並執行時候清理掉引用次數為0的值佔用的空間。

看起來也不錯的方式，為什麼很少有瀏覽器採用，還會帶來記憶體泄露問題呢？主要是因為這種方式沒辦法解決循環參考問題。比如對象A有一個屬性指向對象B，而對象B也有有一個屬性指向對象A，這樣相互引用

複製代碼 代碼如下:

function test(){
            var a={};
            var b={};
            a.prop=b;
            b.prop=a;
        }

這樣a和b的引用次數都是2，即使在test()執行完成後，兩個對象都已經離開環境，在標記清除的策略下是沒有問題的，離開環境的就被清除，但是在引用計數策略下不行，因為這兩個對象的引用次數仍然是2，不會變成0，所以其佔用空間不會被清理，如果這個函數被多次調用，這樣就會不斷地有空間不會被回收，造成記憶體泄露。

在IE中雖然JavaScript對象通過標記清除的方式進行記憶體回收，但BOM與DOM對象卻是通過引用計數回收垃圾的，也就是說只要涉及BOM及DOM就會出現循環參考問題。看上面的例子，有同學回覺得太弱了，誰會做這樣無聊的事情，其實我們是不是就在做

複製代碼 代碼如下:

window.onload=function outerFunction(){
        var obj = document.getElementById("element");
        obj.onclick=function innerFunction(){};
    };

這段代碼看起來沒什麼問題，但是obj引用了document.getElementById("element")，而document.getElementById("element")的onclick方法會引用外部環境中德變數，自然也包括obj，是不是很隱蔽啊。

解決辦法

最簡單的方式就是自己手工解除循環參考，比如剛才的函數可以這樣

複製代碼 代碼如下:

window.onload=function outerFunction(){
        var obj = document.getElementById("element");
        obj.onclick=function innerFunction(){};
       obj=null;
    };

什麼時候觸發記憶體回收

記憶體回收行程周期性運行，如果分配的記憶體非常多，那麼回收工作也會很艱巨，確定記憶體回收時間間隔就變成了一個值得思考的問題。IE6的記憶體回收是根據記憶體配置量啟動並執行，當環境中存在256個變數、4096個對象、64k的字串任意一種情況的時候就會觸發記憶體回收行程工作，看起來很科學，不用按一段時間就調用一次，有時候會沒必要，這樣按需調用不是很好嗎？但是如果環境中就是有這麼多變數等一直存在，現在指令碼如此複雜，很正常，那麼結果就是記憶體回收行程一直在工作，這樣瀏覽器就沒法兒玩兒了。

微軟在IE7中做了調整，觸發條件不再是固定的，而是動態修改的，初始值和IE6相同，如果記憶體回收行程回收的記憶體配置量低於程式佔用記憶體的15%，說明大部分記憶體不可被回收，設的記憶體回收觸發條件過于敏感，這時候把臨街條件翻倍，如果回收的記憶體高於85%，說明大部分記憶體早就該清理了，這時候把觸發條件置回。這樣就使記憶體回收工作職能了很多。

同C# 、Java一樣我們可以手工調用記憶體回收程式，但是由於其消耗大量資源，而且我們手工調用的不會比瀏覽器判斷的準確，所以不推薦手工調用記憶體回收。