本文實例分析了javascript中閉包概念與用法。分享給大家供大家參考，具體如下：

1.問題的引出，什么時候會遇到閉包？

首先因為JS是沒有塊狀作用域的，但是有函數(shù)作用域即函數(shù)作為了局部變量之間的界限，不同函數(shù)內(nèi)的局部變量具有獨立性，

因為JS沒有塊狀作用域，筆者初學(xué)JS時，在事件的監(jiān)聽時，因為不理解JS中局部變量的作用域，犯過不少錯誤！

(1)JS中的變量作用域

for(var i=0;i<9;i++)
{
}
alert(i) //輸出9

我們發(fā)現(xiàn)，雖然變量i是塊狀區(qū)域for()內(nèi)的一個局部變量，但是我們在塊級作用域for（）外，依然可以得到變量i

(2)JS中的函數(shù)作用域

function abc(){
 var a=1;
}
abc();
alert(a);// 會報錯，a is not defined

我們發(fā)現(xiàn)，在函數(shù)外調(diào)用函數(shù)后，在函數(shù)外是無法取到函數(shù)里的變量

總結(jié)：通過（1），（2），我們加深了對JS中，沒有塊級作用域只有函數(shù)作用域的理解！

舉例：如果現(xiàn)在例1：

var a=1
function abc(){
 var a=2;
}
abc();
alert(a) // a=1

特別注意如果例2：

var a=1
function abc(){
a=2;
alert(a);
}
abc();//a=2

對比例1，不同之處在于例2，中 是“a=2"而不是”var a=2“

區(qū)別在于如果是var a,則表示在函數(shù)中定義變量a，如果是沒有變量聲明，如果直接a，則表示在全局變量中定義變量a；

2.如果引用函數(shù)內(nèi)部的變量？

由1可知，JS中只存在函數(shù)作用域，那么我們?nèi)绾尾拍茉谀玫胶瘮?shù)中定義的變量呢？

根據(jù)JS的語法規(guī)則：內(nèi)部函數(shù)（或者內(nèi)部對象）中，可以訪問外部函數(shù)中的變量。

什么意思呢？舉例說明例1：

function abc(){
 var a=1;
 !function(){
 alert(a)
} ()
} //此時不會報錯，a=1

再舉一個例子（內(nèi)部對象的例子）例2：

var o={
 a=1,
 myfun:function(){
 return this.a
}
}

則alert(o.myfun())得到的值為1，現(xiàn)在我們大概了解了如何訪問函數(shù)（或者對象，其實函數(shù)的本身也是對象）中的變量！

3.什么是閉包？

我的理解就定義在一個函數(shù)內(nèi)部的函數(shù)！

閉包是函數(shù)內(nèi)部與外部之間的橋梁！

即內(nèi)部函數(shù)在定義它的外部使用時，就創(chuàng)建了一個閉包！

我們知道，一般情況下，當函數(shù)被調(diào)用完，內(nèi)存會被釋放，但是應(yīng)用于函數(shù)閉包比如

function abc1(){
 var a=1;
function abc2(){
 a++；
}
return abc2()
}

當我們調(diào)用abc1()函數(shù)后，因為abc1函數(shù)的中又調(diào)用了abc2(）函數(shù)，因此函數(shù)abc1()中的變量在子函數(shù)中被調(diào)用，所以在父函數(shù)abc1（)調(diào)用結(jié)束后

變量a的內(nèi)存空間并不會被釋放！

為什么GC機制無法回收abc1()函數(shù)中的變量a，  因為首先我們在全局中調(diào)用了函數(shù)abc1(），我們設(shè)全局對象為c，abc1(）對象為b，同時我們在對象b

即函數(shù)abc1（）中又調(diào)用了函數(shù)abc2（),設(shè)abc2（0為a。

再次理解這種關(guān)系    c中調(diào)用了b，b中又調(diào)用了a,JS中規(guī)定當a,b對象兩兩互相引用，并且a,b中又有一個被a,b函數(shù)之外的對象c引用時，GC機制不執(zhí)行垃圾回收（變量清空）！

由此我們引出了閉包的重要作用：

如果內(nèi)部函數(shù)在其外部被調(diào)用，則會產(chǎn)生閉包，閉包用于保存某些變量的值，不會被垃圾回收機制回收！

4.閉包的缺點

因為使用閉包后，某些變量會在函數(shù)調(diào)用之后持續(xù)的保持在內(nèi)存中，因此濫用閉包會導(dǎo)致內(nèi)存泄漏！

5.擴展應(yīng)用，加深對于閉包的理解！

var o={
 a:1;
myfunc:function(){
return function(){
 return this.a;
}
}
alert(o.myfunc()()); // a is not defined
}

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript數(shù)學(xué)運算用法總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》及《JavaScript遍歷算法與技巧總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

最新評論