關(guān)于js內(nèi)存泄露的一個(gè)好例子
更新時(shí)間：2013年12月09日 09:53:09 作者：
這篇文章主要介紹了關(guān)于js內(nèi)存泄露的一個(gè)好例子。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
我把別人的例子改了一下，覺(jué)得這樣寫(xiě)更緊湊！套用別人的原話(huà)，當(dāng)一個(gè)DOM對(duì)象包含一個(gè)Js對(duì)象的引用(例如一個(gè)Event Handler)， 而這個(gè)Js對(duì)象又持有對(duì)這個(gè)DOM對(duì)象的引用時(shí)，一個(gè)環(huán)狀引用就行成了，于是在ie下就出現(xiàn)了內(nèi)存泄露。點(diǎn)擊“運(yùn)行代碼”并打開(kāi)任務(wù)管理器看內(nèi)存變化。分別在ie8和ff下測(cè)試，差距不用多說(shuō)。
運(yùn)行代碼
復(fù)制代碼 代碼如下:
<html>
<head>
<title>Memory leak</title>
<style>
body{
padding: 10px;
}
</style>
</head>
<body>
</body>
<script>
var q = [];
var n = 0;
setInterval(function(){
q.push(makeSpan());
if(q.length>=10){
var s = q.shift();
if(s){
s.parentNode.removeChild(s);
}
}
n++;
},10);
function makeSpan(){
var s = document.createElement("span");
document.body.appendChild(s);
var t=document.createTextNode("*** " + n + " ***");
s.appendChild(t);
s.onclick=function(e){
s.style.backgroundColor="red";
alert(n);
};
return s;
};
</script>
</html>
那么在ie下該怎么解決呢？
在刪除節(jié)點(diǎn)的時(shí)候，手動(dòng)破除環(huán)狀引用，把里面setInterval那段代碼稍微改動(dòng)以下：
復(fù)制代碼 代碼如下:
setInterval(function(){
q.push(makeSpan());
if(q.length>=10){
var s = q.shift();
if(s){
s.onclick = null;//關(guān)鍵在這里
s.parentNode.removeChild(s);
}
}
n++;
},10);
您可能感興趣的文章:
- 解決JS內(nèi)存泄露之js對(duì)象和dom對(duì)象互相引用問(wèn)題
- JS閉包、作用域鏈、垃圾回收、內(nèi)存泄露相關(guān)知識(shí)小結(jié)
- 解決js函數(shù)閉包內(nèi)存泄露問(wèn)題的辦法
- 淺談js 閉包引起的內(nèi)存泄露問(wèn)題
- JavaScript避免內(nèi)存泄露及內(nèi)存管理技巧
- 容易造成JavaScript內(nèi)存泄露幾個(gè)方面
- js內(nèi)存泄露的幾種情況詳細(xì)探討
- Javascript 閉包引起的IE內(nèi)存泄露分析
- 權(quán)威JavaScript 中的內(nèi)存泄露模式
- 總結(jié)JavaScript在IE9之前版本中內(nèi)存泄露問(wèn)題
相關(guān)文章
JS+CSS3實(shí)現(xiàn)超炫的散列畫(huà)廊特效
這篇文章主要為大家詳細(xì)介紹了JS+CSS3實(shí)現(xiàn)超炫的散列畫(huà)廊特效，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-07-07
easycom是uniapp的一種組件自動(dòng)引入的規(guī)則,使用這種規(guī)則可以使?jié)M足規(guī)則的組件無(wú)需注冊(cè)直接使用,下面這篇文章主要給大家介紹了關(guān)于uniapp中如何使用easycom自定義組件的相關(guān)資料,需要的朋友可以參考下2023-05-05
layer彈出子iframe層父子頁(yè)面?zhèn)髦档膶?shí)現(xiàn)方法
這篇文章主要介紹了layer彈出子iframe層父子頁(yè)面?zhèn)髦档膶?shí)現(xiàn)方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2018-11-11
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)隨機(jī)抽取三人，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11
JS實(shí)現(xiàn)移動(dòng)端判斷上拉和下滑功能
通過(guò)手指觸屏，利用touchstart和touchend計(jì)算前后滑動(dòng)距離，判斷是上拉還是下滑。接下來(lái)通過(guò)實(shí)例代碼給大家介紹js移動(dòng)端判斷上拉和下滑功能，感興趣的朋友一起看看吧2017-08-08
這篇文章主要為大家詳細(xì)介紹了Exif.js圖片旋轉(zhuǎn)修正的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-02-02
axios攔截器機(jī)制的實(shí)現(xiàn)原理詳解
axios 不僅提供了一套跨平臺(tái)請(qǐng)求,另外還提供了“攔截器”這一中間件機(jī)制,方便你在請(qǐng)求之前、響應(yīng)之后做些操作處理,本文給大家詳細(xì)介紹了axios 攔截器機(jī)制是如何實(shí)現(xiàn)的,需要的朋友可以參考下2024-05-05
js前端如何寫(xiě)一個(gè)精確的倒計(jì)時(shí)代碼
關(guān)于寫(xiě)倒計(jì)時(shí)大家可能都都比較熟悉，使用 setTimeout 或 setInterval 就可以搞定。幾秒鐘或者幾分鐘的倒計(jì)時(shí)這樣寫(xiě)沒(méi)有問(wèn)題，但是如果是長(zhǎng)時(shí)間的倒計(jì)時(shí)，這樣寫(xiě)就會(huì)不準(zhǔn)確2019-10-10
目前小程序使用比較多的富文本方案一個(gè)是小程序自帶的rich-text組件，一個(gè)是wxPrase，本篇文章主要介紹了詳解小程序rich-text對(duì)富文本支持方案，感興趣的小伙伴們可以參考一下2018-11-11
下面小編就為大家?guī)?lái)一篇淺談JavaScript中數(shù)組的增刪改查。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-06-06