Question

我目前正在读完JavaScript。我在http://www.w3schools.com/js/js_function_closures.asp上关于JavaScript中的闭包（允许“私有变量”）的章节。

示例是一个计数器：

<!DOCTYPE html>
<html>
<body>

<p>Counting with a local variable.</p>

<button type="button" onclick="myFunction()">Count!</button>

<p id="demo">0</p>

<script>
var add = (function () {
    var counter = 0;
    return function () {return counter += 1}
})()

function myFunction(){
    document.getElementById("demo").innerHTML = add();
}
</script>

</body>
</html>

它声明它使用自调用函数将计数器设置为0 一次，并在每次迭代add（）时将计数器递增1。但是，我在代码中看到用于自调用函数的花括号围绕counter = 0和增加计数器的函数。我很难想象两个命令在自调用函数中的确切程度，但只运行一次，而另一个运行每次迭代。

Answer 1

让我们把这个问题分解成几个部分：

（1）

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

第一部分是自调用匿名函数，这意味着add将收到执行此函数的结果。在这种情况下，只有以下匿名函数：

function () {return counter += 1;}   (2)

所以这意味着add将是一个函数！

现在有趣的部分是在siaf（1）（自我调用 - 匿名函数）中，我们重新声明一个计数器变量，初始化为零：

var counter = 0;

因为计数器属于（2）的外部范围，所以（2）可以访问它！

JavaScript所说的是，创建时的函数会捕获其环境并持久化，因此闭包（close）只不过是函数与其创建环境的组合。这意味着在return语句之后，现在将保存对（2）的引用的add函数仍然可以访问最初设置为0的计数器变量;

所以为了递增计数器，我们需要递增（2），这意味着递增加，如：

add();

p.s：使用Function构造函数创建的函数，并以与（2）相同的方式返回，但不会捕获计数器变量!!

在JavaScript闭包中使用自调用函数

1 个答案: