Son*_*Gao 0 javascript self-invoking-function
我目前正在读完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>
Run Code Online (Sandbox Code Playgroud)
它声明它使用自调用函数将计数器设置为0 一次,并在每次迭代add()时递增计数器.但是,我在代码中看到,用于自调用函数的花括号围绕着counter = 0和增加计数器的函数.我很难想象两个命令在自调用函数中的确切程度,但只运行一次,而另一个运行每次迭代.
让我们把这个问题分解成碎片:
(1)
var add = (function () {
var counter = 0;
return function () {return counter += 1;}
})();
Run Code Online (Sandbox Code Playgroud)
第一部分是自调用匿名函数,这意味着add将接收执行此函数的结果.在这种情况下,只有以下匿名函数:
function () {return counter += 1;} (2)
Run Code Online (Sandbox Code Playgroud)
所以这意味着添加将是一个功能!
现在有趣的部分是在siaf(1)(自调用 - 匿名函数)中,我们声明一个计数器变量,初始化为零:
var counter = 0;
Run Code Online (Sandbox Code Playgroud)
因为计数器属于(2)的外部范围,所以(2)可以访问它!
JavaScript所说的是,创建的函数将捕获其环境并持久化,因此闭包(close)只不过是函数与其创建环境的组合.这意味着在return语句之后,现在将保存对(2)的引用的add函数仍然可以访问最初设置为0的计数器变量;
所以为了递增计数器,我们需要递增(2),这意味着递增加这样:
add();
Run Code Online (Sandbox Code Playgroud)
ps:用Function构造函数创建的函数,以与(2)相同的方式返回,不会捕获计数器变量!!
| 归档时间: |
|
| 查看次数: |
1842 次 |
| 最近记录: |