中文高清一区,亚洲高清精品中出,午夜精品999

關于JS中作用域的銷毀和不銷毀的情況總結

2021-7-26 前端達人

window全局作用域->頁面關掉才銷毀
函數執行會形成私有的作用域

1)作用域的銷毀
一般情況下，函數執行形成一個私有的作用域，當執行完成后就銷毀了->節省內存空間

2)作用域的不立即銷毀
function fn(){
var i=10;
return function(n){
console.log(n+i++);
}
}
fn()(15);//->先執行fn,有一個私有的變量i=10,返回一個堆內存地址 xxxfff111,我們發現這個地址還用到了一次,那么當前的這個fn形成私有作用域（A）就不能立即銷毀了,xxxfff111(15)->輸出25,A中的i變為11；當xxxfff111執行完了,發現這個地址沒用了,瀏覽器就把A、xxxfff111都釋放了

fn()(20);//->在執行fn的時候一切都從新開始了,和上面的步驟是一樣的->輸出30

3)作用域的不銷毀：形成一個私有作用域,里面的內容被外面占用了
function fn(){
var i=10;
return function(n){
console.log(n+i++);
}
}
var f=fn();//->fn執行形成一個私有的作用域A,A中有一個私有的變量i=10,A中返回一個地址xxxfff11,被外面的f占用了,那么當前的A就不能銷毀了
f(15);//->輸出25,讓A中的i=11
f(20);//->輸出31,讓A中的i=12
...
當我們知道f用完的時候,為了優化性能,我們讓f=null,這樣的話A中的xxxfff111沒人占用了,瀏覽器會把A和xxxfff111都釋放了

幾種不銷毀常用到的形式:
1)函數執行,返回一個引用數據類型的值,并且在函數的外面被別人接收了,那么當前函數形成的私有作用域就不在銷毀了-->例如上面的案例

2)在函數執行的時候,里面的一個小函數的地址賦值給了我們的外面元素的點擊事件,那么當前小函數也相當于被外面占用了,大函數執行形成的私有的作用域也不銷毀了
//每一次循環都執行自執行函數形成一個私有的作用域(循環三次就有三個作用域,每一個作用域中都有一個i,第一個存儲的是0,第二個存數的是1..)，在每一個私有的作用域中都把里面的函數綁定給了外面元素的點擊事件,這樣的話每一次形成的作用域都不銷毀了(三個不銷毀的作用域)
var oLis=document.getElementsByTagName("li");
for(var i=0;i<oLis.length;i++){
~function(i){
oLis[i].onclick=function(){
tabChange(i);
}
}(i);
}

3)在使用setTimeout實現輪詢動畫的時候,我們如果move需要傳遞參數值,那么像下面這樣的寫法會行成很多的不銷毀的作用域,非常的耗性能
function move(tar){
<js code>

//window.setTimeout(move,10); ->第二次執行move的時候我們沒有給它傳值(這樣寫不行)
window.setTimeout(function(){
move(tar);
},10);//->這樣寫實現了,但是每一次執行定時器都會形成一個私有的所用域(匿名函數形成的)A,在A中使用了上級作用域中的tar的值,而且執行了move又形成了一個小的作用域(而在小的作用域中會使用tar的值),這樣每一次定時器形成的A都不能銷毀了
}
move(100);//->第一次這樣執行傳遞100

//解決辦法:
function move(tar){
~function _move(){
<js code>
window.setTimeout(_move,10);
}();
}
move(100);//->第一次這樣執行傳遞100

JS中內存空間釋放的問題（堆內存、棧內存）
[谷歌瀏覽器]
我們開辟一個內存，可能或有一些其他的變量等占用了這個內存，谷歌瀏覽器都會間隔一段時間看這個內存還有沒有被占用，如果發現有沒有被占用的內存了，就自己幫我們回收了(內存釋放)

[火狐和IE]
我們開個內存，當我們引用了它，就在內存中記錄一個數,增加一個引用瀏覽器就把這個數+1，減少一個引用，瀏覽器就把這個數-1...當減到零的時候瀏覽器就把這個內存釋放了;但是有些情況下(尤其是IE)記著記著就弄亂了，內存就不能釋放了-->瀏覽器的內存泄露

var obj={};
我們養成一個好的習慣，當我們obj這個對象使用完成了，我們手動的obj=null (null空對象指針)，瀏覽器會自己把剛才的堆內存釋放掉

標簽: javascript