先看問題的引入:
可以實現計數器,但是變數counter在函式外,不是函式的私有變數。
var counter = 0;
// 遞增計數器的函式
function add() {
counter += 1;
return counter;
}
function myFunction(){
document.getElementById(“demo”).innerHTML = add();
}
為了防止別的函式修改這個變數,需要達到效果是這個變數只能讓這個函式訪問。
頁面上的任何程式碼都可以更改計數器,而無需呼叫 add()。
對於 add() 函式,計數器應該是區域性的,以防止其他程式碼更改它:
// 遞增計數器的函式
function add() {
var counter = 0;
counter += 1;
return counter;
}
// 呼叫三次 add()
add();
add();
add();
//此時計數器應該是 3。但它是 1。
它沒有用,因為我們每次呼叫函式時都會重置本地計數器。
解決:
var add = (function () {
var counter = 0;
return function () {return counter += 1;}
})();
add();
add();
add();
// 計數器目前是 3
例子解釋
變數 add
的賦值是自呼叫函式的返回值。
這個自呼叫函式只執行一次。它設定計數器為零(0),並返回函式表示式。
這樣 add 成為了函式。最“精彩的”部分是它能夠訪問父作用域中的計數器。
這被稱為 JavaScript 閉包。它使函式擁有“私有”變數成為可能。
計數器被這個匿名函式的作用域保護,並且只能使用 add 函式來修改。
閉包指的是有權訪問父作用域的函式,即使在父函式關閉之後。
本作品採用《CC 協議》,轉載必須註明作者和本文連結