JavaScript的記憶體釋放問題詳解_javascript技巧

本文詳細的說明了JavaScript及IE瀏覽器對記憶體的管理和釋放的時機和方法，希望對前端開發人員有所幫助。

一個記憶體釋放的實例

複製程式碼 程式碼如下:

CollectGarbage,是IE的一個特有屬性,用於釋放記憶體的，使用方法嘛應該是,將該變數或引用物件,設為null或delete，然後在進行釋放動作

在做CollectGarbage前,要必需清楚的兩個必備條件:

引用- 一個物件在其生存的上下文環境之外，即會失效。
- 一個全域的物件在沒有被執用(引用)的情況下，即會失效。

複製程式碼 程式碼如下:

//------------------------------------------------ ---------
// JavaScript物件何時失效
//------------------------------------------------ ---------
function testObject() {
var _obj1 = new Object();
}
function testObject2() {
var _obj2 = new Object();
return _obj2;
}
// 範例1
testObject();
// 範例2
testObject2()
// 範例3
var obj3 = testObject2();
obj3 = null;
// 範例4
var obj4 = testObject2();
var arr = [obj4];
obj3 = null;
arr = [];

在這四個範例中：
- 「範例1」在函式testObject()中建構了_obj1，但在函式退出時，它就已經離開了函式的上下文環境，因此_obj1失效了；

- 「範例2」中，testObject2()中也建構了一個物件_obj2並傳出，因此物件有了「函數外」的上下文環境(和生存週期)，然而由於函數的回傳值沒有被其它變數“持有”，因此_obj2也立即失效了；

- 「範例3」中，testObject2()構造的_obj2被外部的變數obj3持用了，這時，直到「obj3=null」這行程式碼生效時，_obj2才會因為引用關係消失而失效。

- 與範例3相同的原因，「範例4」中的_obj2會在「arr=[]」這行程式碼之後才會失效。

但是，物件的「失效」並不等會「釋放」。在JavaScript運行環境的內部，沒有任何方式來確切地告訴使用者「物件什麼時候會釋放」。這依賴JavaScript的記憶體回收機制。 ——這種策略與.NET中的回收機制是類別同的。

在前面的Excel操作範例程式碼中，物件的擁有者，也就是"EXCEL.EXE"這個行程只能在「ActiveX Object實例的釋放」之後才會發生。而檔案的鎖，以及作業系統的權限憑證是與進程相關的。因此如果物件僅是“失效”而不是“釋放”，那麼其它進程處理檔案和引用作業系統的權限憑證時就會出問題。

－－有些人說這是JavaScript或COM機制的BUG。其實不是，這是ＯＳ、ＩＥ和JavaScript之間的一種複雜關係所導致的，而​​非獨立的問題。

Microsoft公開了解決這種問題的策略：主動呼叫記憶體回收過程。

在(微軟的)JScript中提供了一個CollectGarbage()過程(通常簡稱GC過程)，GC過程用於清理當前IE中的“失效的對象失例”，也就是調用對象的析構過程。

在上例中呼叫GC過程的程式碼是：

複製程式碼 程式碼如下:

//------------------------------------------------ ---------
// 處理ActiveX Object時，GC過程的標準呼叫方式
//------------------------------------------------ ---------
function writeXLS() {
//(略...)
excel.Quit();
excel = null;
setTimeout(CollectGarbage, 1);
}

第一行程式碼呼叫excel.Quit()方法使得excel程序中止並退出，這時由於JavaScript環境執有excel物件實例，因此excel進程並不實際中止。

第二行程式碼使excel為null，以清除物件引用，從而使物件「失效」。然而由於物件仍舊在函數上下文環境中，因此如果直接呼叫GC過程，物件仍然不會被清理。

第三行程式碼使用setTimeout()來呼叫CollectGarbage函數，時間間隔設為'1'，只是使得GC過程發生在writeXLS()函數執行完之後。這樣excel物件就滿足了「能被GC清理」的兩個條件：沒有引用和離開上下文環境。

GC過程的使用，在使用了ActiveX Object的JS環境中很有效。一些潛在的ActiveXObject包括XML、VML、OWC(Office Web Componet)、flash，甚至包括在JS中的VBArray。從這一點來看，ajax架構由於採用了XMLHTTP，並且同時要滿足「不切換頁面」的特性，因此在適當的時候主動呼叫GC過程，會得到更好的效率用UI體驗。

事實上，即使使用GC過程，前面提到的excel問題仍然不會完全解決。因為IE還快取了權限憑證。使頁面的權限憑證被更新的唯一方法，只能是“切換到新的頁面”，

因此事實上在前面提到的那個SPS專案中，我採用的方法並不是GC，而是下面這段程式碼：

複製程式碼 程式碼如下:

//------------------------------------------------ ---------
// 處理ActiveX Object時所採用的頁面切換程式碼
//------------------------------------------------ ---------
function writeXLS() {
//(略...)
excel.Quit();
excel = null;
// 以下程式碼用來解決IE call Excel的一個BUG, MSDN中提供的方法:
// setTimeout(CollectGarbage, 1);
// 由於不能清除(或同步)網頁的受信任狀態, 所以將導致SaveAs()等方法在
// 下次呼叫時無效.
location.reload();
}

delete 運算子在手冊上的說明
引用從物件中刪除一個屬性，或從陣列中刪除一個元素。

delete expression

expression 參數是一個有效的 JScript 表達式，通常是一個屬性名稱或陣列元素。

說明

如果 expression 的結果是一個對象，且在 expression 中指定的屬性存在，而該對象又不允許它被刪除，則返回 false。

在所有其他情況下，傳回 true。

最後之最後，關於GC的一個補充說明：在IE窗體被最小化時，IE將會主動呼叫一次CollectGarbage()函數。這使得IE視窗在最小化之後，記憶體佔用會有明顯改善