JavaScript 闭包

JavaScript 变量可以属于当地的或者全球的作用域。

全局变量可以设置为本地（私有）关闭。

全局变量

function可以访问所有定义的变量里面函数，像这样：

示例

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

亲自试一试 »

但一个function还可以访问定义的变量外部函数，像这样：

示例

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

亲自试一试 »

在最后一个例子中，A是一个全球的多变的。

在网页中，全局变量属于该页面。

页面中的所有其他脚本都可以使用（和更改）全局变量。

在第一个例子中，A是一个当地的多变的。

局部变量只能在定义它的函数内部使用。它对其他函数和其他脚本代码是隐藏的。

具有相同名称的全局变量和局部变量是不同的变量。修改其中之一，不会修改另一个。

笔记

创建的变量没有声明关键字 (var,let，或者const) 始终是全局的，即使它们是在函数内创建的。

示例

function myFunction() {
a = 4;
}

亲自试一试 »

可变寿命

全局变量一直有效，直到页面被丢弃为止，例如当您导航到另一个页面或关闭窗口时。

局部变量的生命周期很短。它们在调用函数时创建，并在函数完成时删除。

反困境

假设您想使用变量来计数某些内容，并且希望该计数器可供所有函数使用。

您可以使用全局变量和function增加计数器：

示例

// Initiate counter
let counter = 0;

// Function to increment counter
function add() {
counter += 1;
}

// Call add() 3 times
add();
add();
add();

// The counter should now be 3

亲自试一试 »

上述解决方案存在一个问题：页面上的任何代码都可以更改计数器，而无需调用 add()。

计数器应该是本地的add()函数，以防止其他代码更改它：

示例

// Initiate counter
let counter = 0;

// Function to increment counter
function add() {
let counter = 0;
counter += 1;
}

// Call add() 3 times
add();
add();
add();

//The counter should now be 3. But it is 0

亲自试一试 »

它不起作用，因为我们显示全局计数器而不是本地计数器。

我们可以通过让函数返回全局计数器来删除全局计数器并访问本地计数器：

示例

// Function to increment counter
function add() {
let counter = 0;
counter += 1;
return counter;
}

// Call add() 3 times
add();
add();
add();

//The counter should now be 3. But it is 1.

亲自试一试 »

它不起作用，因为我们每次调用该函数时都会重置本地计数器。

JavaScript 内部函数可以解决这个问题。

JavaScript 嵌套函数

所有函数都可以访问全局作用域。

事实上，在 JavaScript 中，所有函数都可以访问 "above" 它们的作用域。

JavaScript 支持嵌套函数。嵌套函数可以访问 "above" 它们的作用域。

在这个例子中，内部函数plus()可以访问counter父函数中的变量：

示例

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

亲自试一试 »

如果我们能够达到plus()从外部发挥作用。

我们还需要找到一种方法来执行counter = 0只有一次。

我们需要一个关闭。

JavaScript 闭包

还记得自调用函数吗？这个函数有什么作用？

示例

const add = (function () {
let counter = 0;
return function () {counter += 1; return counter}
})();

add();
add();
add();

// the counter is now 3

亲自试一试 »

示例解释

变量add被分配给自调用函数的返回值。

自调用函数只运行一次。它将计数器设置为零 (0)，并返回一个函数表达式。

这样add就变成了一个函数。 "wonderful" 部分是它可以访问父作用域中的计数器。

这称为 JavaScript关闭。它使得函数可以具有“私人的”变量。

计数器受匿名函数作用域的保护，并且只能使用 add 函数进行更改。

闭包是一个即使在父函数关闭之后也可以访问父作用域的函数。