Javascript閉包

JavaScript 變量可以是局部變量或全局變量。

私有變量可以用到閉包。

全局變量

函數(shù)可以訪問由函數(shù)內(nèi)部定義的變量,如:

function myFunction() {
    var a = 4;
    return a * a;
}

函數(shù)也可以訪問函數(shù)外部定義的變量,如:

var a = 4;
function myFunction() {
    return a * a;
}

后面一個實例中, a 是一個 全局 變量。

在web頁面中全局變量屬于 window 對象。

全局變量可應(yīng)用于頁面上的所有腳本。

在第一個實例中, a 是一個 局部 變量。

局部變量只能用于定義它函數(shù)內(nèi)部。對于其他的函數(shù)或腳本代碼是不可用的。

全局和局部變量即便名稱相同,它們也是兩個不同的變量。修改其中一個,不會影響另一個的值。

變量生命周期

全局變量的作用域是全局性的,即在整個JavaScript程序中,全局變量處處都在。

而在函數(shù)內(nèi)部聲明的變量,只在函數(shù)內(nèi)部起作用。這些變量是局部變量,作用域是局部性的;函數(shù)的參數(shù)也是局部性的,只在函數(shù)內(nèi)部起作用。

計數(shù)器困境

設(shè)想下如果你想統(tǒng)計一些數(shù)值,且該計數(shù)器在所有函數(shù)中都是可用的。

你可以使用全局變量,函數(shù)設(shè)置計數(shù)器遞增:

var counter = 0;
 
function add() {
   return counter += 1;
}
 
add();
add();
add();
 
// 計數(shù)器現(xiàn)在為 3

計數(shù)器數(shù)值在執(zhí)行 add() 函數(shù)時發(fā)生變化。

但問題來了,頁面上的任何腳本都能改變計數(shù)器,即便沒有調(diào)用 add() 函數(shù)。

如果我在函數(shù)內(nèi)聲明計數(shù)器,如果沒有調(diào)用函數(shù)將無法修改計數(shù)器的值:

function add() {
    var counter = 0;
    return counter += 1;
}
 
add();
add();
add();
 
// 本意是想輸出 3, 但事與愿違,輸出的都是 1 !

以上代碼將無法正確輸出,每次我調(diào)用 add() 函數(shù),計數(shù)器都會設(shè)置為 1。

JavaScript 內(nèi)嵌函數(shù)可以解決該問題。

JavaScript 內(nèi)嵌函數(shù)

所有函數(shù)都能訪問全局變量。

實際上,在 JavaScript 中,所有函數(shù)都能訪問它們上一層的作用域。

JavaScript 支持嵌套函數(shù)。嵌套函數(shù)可以訪問上一層的函數(shù)變量。

該實例中,內(nèi)嵌函數(shù) plus() 可以訪問父函數(shù)的 counter 變量:

function add() {
    var counter = 0;
    function plus() {counter += 1;}
    plus();    
    return counter; 
}

如果我們能在外部訪問 plus() 函數(shù),這樣就能解決計數(shù)器的困境。

我們同樣需要確保 counter = 0 只執(zhí)行一次。

我們需要閉包。

JavaScript 閉包

還記得函數(shù)自我調(diào)用嗎?該函數(shù)會做什么?

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();
 
add();
add();
add();
 
// 計數(shù)器為 3

實例解析

變量 add 指定了函數(shù)自我調(diào)用的返回字值。

自我調(diào)用函數(shù)只執(zhí)行一次。設(shè)置計數(shù)器為 0。并返回函數(shù)表達(dá)式。

add變量可以作為一個函數(shù)使用。非常棒的部分是它可以訪問函數(shù)上一層作用域的計數(shù)器。

這個叫作 JavaScript 閉包。它使得函數(shù)擁有私有變量變成可能。

計數(shù)器受匿名函數(shù)的作用域保護(hù),只能通過 add 方法修改。

==閉包是一種保護(hù)私有變量的機(jī)制,在函數(shù)執(zhí)行時形成私有的作用域,保護(hù)里面的私有變量不受外界干擾。
直觀的說就是形成一個不銷毀的棧環(huán)境。==

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 如果要了解閉包,我們需要先了解閉包的由來,閉包的產(chǎn)生,源于JS的詞法作用域 詞法作用域 作用域是指一個 變量能夠訪...
    羊烊羴閱讀 279評論 0 2
  • JavaScript 變量可以是局部變量或全局變量。私有變量可以用到閉包。 全局變量 函數(shù)可以訪問由函數(shù)內(nèi)部定義的...
    Joel_zh閱讀 189評論 0 0
  • JavaScript 變量可以是局部變量或全局變量。私有變量可以用到閉包。 全局變量 變量聲明時如果不使用 var...
    S大偉閱讀 358評論 0 0
  • 閉包是函數(shù)和聲明該函數(shù)的詞法環(huán)境的組合 ? 一個擁有許多變量和綁定了這些變量的環(huán)境的表達(dá)式(通常是一個函數(shù)),...
    郭豪豪閱讀 388評論 0 0
  • 閉包總是讓人摸不著頭腦。陸陸續(xù)續(xù)接觸了一些閉包的知識,但還是不是非常明白,最近偶然看了一下 jQuery基礎(chǔ)教程 ...
    深沉的簡單閱讀 175評論 0 0

友情鏈接更多精彩內(nèi)容