談?wù)凧avaScript中的垃圾回收機(jī)制
JavaScript 具有自動(dòng)垃圾收集機(jī)制,也就是說(shuō),執(zhí)行環(huán)境會(huì)負(fù)責(zé)管理代碼執(zhí)行過(guò)程中使用的內(nèi)存。
在編寫(xiě) JavaScript 程序時(shí),開(kāi)發(fā)人員不用再關(guān)心內(nèi)存使用問(wèn)題,所需內(nèi)存的分配以及無(wú)用內(nèi)存的回收完全實(shí)現(xiàn)了自動(dòng)管理。
這種垃圾收集機(jī)制的原理其實(shí)很簡(jiǎn)單:找出那些不再繼續(xù)使用的變量,然后釋放其占用的內(nèi)存。為此,垃圾收集器會(huì)按照固定的時(shí)間間隔(或代碼執(zhí)行中預(yù)定的收集時(shí)間), 周期性地執(zhí)行這一操作。
具體到瀏覽器中的實(shí)現(xiàn),則通常有兩個(gè)策略,分別為標(biāo)記清除和引用計(jì)數(shù)。
一、標(biāo)記清除
JavaScript 中最常用的垃圾收集方式是標(biāo)記清除(mark-and-sweep)。當(dāng)變量進(jìn)入環(huán)境(例如,在函數(shù)中聲明一個(gè)變量)時(shí),就將這個(gè)變量標(biāo)記為“進(jìn)入環(huán)境”。而當(dāng)變量離開(kāi)環(huán)境時(shí),則將其標(biāo)記為“離開(kāi)環(huán)境”。
垃圾收集器在運(yùn)行的時(shí)候會(huì)給存儲(chǔ)在內(nèi)存中的所有變量都加上標(biāo)記??梢允褂萌魏螛?biāo)記方式,比如,可以通過(guò)翻轉(zhuǎn)某個(gè)特殊的位來(lái)記錄一個(gè)變量何時(shí)進(jìn)入環(huán)境, 或者使用一個(gè)“進(jìn)入環(huán)境的”變量列表及一個(gè)“離開(kāi)環(huán)境的”變量列表來(lái)跟蹤哪個(gè)變量發(fā)生了變化。
然后,它會(huì)去掉環(huán)境中的變量以及被環(huán)境中的變量引用的變量的標(biāo)記。而在此之后再被加上標(biāo)記的變量將被視為準(zhǔn)備刪除的變量,原因是環(huán)境中的變量已經(jīng)無(wú)法訪問(wèn)到這些變量了。
最后,垃圾收集器完成內(nèi)存清除工作,銷毀那些帶標(biāo)記的值并回收它們所占用的內(nèi)存空間。
二、引用計(jì)數(shù)
另一種不太常見(jiàn)的垃圾收集策略叫做引用計(jì)數(shù)(reference counting)。引用計(jì)數(shù)的含義是跟蹤記錄每個(gè)值被引用的次數(shù)。
當(dāng)聲明了一個(gè)變量并將一個(gè)引用類型值賦給該變量時(shí),則這個(gè)值的引用次數(shù)就是 1。 如果同一個(gè)值又被賦給另一個(gè)變量,則該值的引用次數(shù)加 1。相反,如果包含對(duì)這個(gè)值引用的變量又取得了另外一個(gè)值,則這個(gè)值的引用次數(shù)減 1。
當(dāng)這個(gè)值的引用次數(shù)變成 0 時(shí),則說(shuō)明沒(méi)有辦法再訪問(wèn)這個(gè)值了,因而就可以將其占用的內(nèi)存空間回收回來(lái)。
這樣,當(dāng)垃圾收集器下次再運(yùn)行時(shí),它就會(huì)釋放那些引用次數(shù)為零的值所占用的內(nèi)存。
存在的問(wèn)題:只要在 IE 中涉及 COM(Component Object Model,組件對(duì)象模型)對(duì)象,就會(huì)存在循環(huán)引用的問(wèn)題。如下面代碼所示:
var element = document.getElementById("some_element"); var myObject = new Object(); myObject.element = element; element.someObject = myObject;
這個(gè)例子在一個(gè) DOM 元素(element)與一個(gè)原生 JavaScript 對(duì)象(myObject)之間創(chuàng)建了循環(huán)引用。
其中,變量 myObject 有一個(gè)名為 element 的屬性指向 element 對(duì)象。
而變量 element 也有 一個(gè)屬性名叫 someObject 回指 myObject。
由于存在這個(gè)循環(huán)引用,即使將例子中的 DOM 從頁(yè)面中移除,它也永遠(yuǎn)不會(huì)被回收。
解決方法:最好是在不使用它們的時(shí)候手工斷開(kāi)原生 JavaScript 對(duì)象與 DOM 元素之間的連接。
myObject.element = null; element.someObject = null;
將變量設(shè)置為 null 意味著切斷變量與它此前引用的值之間的連接。當(dāng)垃圾收集器下次運(yùn)行時(shí),就會(huì)刪除這些值并回收它們占用的內(nèi)存。
三、管理內(nèi)存
確保占用最少的內(nèi)存可以讓頁(yè)面獲得更好的性能。而優(yōu)化內(nèi)存占用的最佳方式,就是為執(zhí)行中的代碼只保存必要的數(shù)據(jù)。
一旦數(shù)據(jù)不再有用,最好通過(guò)將其值設(shè)置為 null 來(lái)釋放其引用——這個(gè)做法叫做解除引用(dereferencing)。
這一做法適用于大多數(shù)全局變量和全局對(duì)象的屬性。局部變量會(huì)在它們離開(kāi)執(zhí)行環(huán)境時(shí)自動(dòng)被解除引用,如下面這個(gè)例子所示:
function createPerson(name){ var localPerson = new Object(); localPerson.name = name; } var globalPerson = createPerson("Nicholas"); globalPerson = null; // 手工解除globalPerson 的引用
變量 globalPerson 取得了 createPerson()函數(shù)返回的值。在 createPerson() 函數(shù)內(nèi)部,我們創(chuàng)建了一個(gè)對(duì)象并將其賦給局部變量localPerson,然后又為該對(duì)象添加了一個(gè)名為 name 的屬性。最后,當(dāng)調(diào)用這個(gè)函數(shù)時(shí),localPerson 以函數(shù)值的形式返回并賦給全局變量 globalPerson。
由于 localPerson 在 createPerson()函數(shù)執(zhí)行完畢后就離開(kāi)了其執(zhí)行環(huán)境,因此無(wú)需我們顯式地去為它解除引用。
但是對(duì)于全局變量 globalPerson 而言,則需要我們?cè)诓皇褂盟臅r(shí)候手工為它解除引用,這也正是上面例子中最后一行代碼的目的。
以上就是談?wù)凧avaScript中的垃圾回收機(jī)制的詳細(xì)內(nèi)容,更多關(guān)于JavaScript 垃圾回收的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
js檢查頁(yè)面上有無(wú)重復(fù)id的實(shí)現(xiàn)代碼
有時(shí)候我們需要檢查一個(gè)頁(yè)面上是否用重復(fù)的id,一般id都是唯一的,也方便控制,那么就可以參考下面的代碼2013-07-07javascript實(shí)現(xiàn)表單提交后,提交按鈕不可用的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)表單提交后,提交按鈕不可用的方法,涉及javascript動(dòng)態(tài)修改表單樣式的技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-04-04百度地圖api應(yīng)用標(biāo)注地理位置信息(js版)
弄了一個(gè)百度地圖來(lái)標(biāo)注地理位置信息,通過(guò)百度api來(lái)獲取地址。這地圖api是javascript版,感興趣的朋友可以了解下,或許對(duì)你有所幫助2013-02-02Array 重排序方法和操作方法的簡(jiǎn)單實(shí)例
下面小編就為大家簡(jiǎn)單的介紹Array中reverse(),sort(),concat(),slice(),splice()方法的應(yīng)用。一起過(guò)來(lái)看看吧2014-01-01js中不常見(jiàn)的運(yùn)算符與操作符總結(jié)
運(yùn)算符(operator)也被稱為操作符,是用于實(shí)現(xiàn)賦值、比較和執(zhí)行算數(shù)運(yùn)算等功能的符號(hào),這篇文章主要給大家介紹了關(guān)于js中不常見(jiàn)的運(yùn)算符與操作符的相關(guān)資料,需要的朋友可以參考下2021-06-06ES6 Iterator接口和for...of循環(huán)用法分析
這篇文章主要介紹了ES6 Iterator接口和for...of循環(huán)用法,結(jié)合實(shí)例形式分析了Iterator接口和for...of循環(huán)相關(guān)使用技巧,需要的朋友可以參考下2019-07-07TypeScript中interface和type的區(qū)別詳解
本文主要介紹了TypeScript中interface和type的區(qū)別詳解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07js實(shí)現(xiàn)增加數(shù)字顯示的環(huán)形進(jìn)度條效果
本文主要分享了js實(shí)現(xiàn)增加數(shù)字顯示的環(huán)形進(jìn)度條效果的示例代碼。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-02-02