需要更多关于w3schools javascript封面示例的解释 [英] need more explanation on w3schools javascript closure example
问题描述
我正在尝试了解闭包，正在查看W3Schools的javascript教程。这是他们通过制作一个计数器给出的一个例子。
I'm trying to understand closures and am looking at the W3Schools javascript tutorial. This is one example they give by making a counter.
<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>
示例说明变量add已分配
自调用函数的返回值。
Example Explained The variable add is assigned the return value of a self-invoking function.
自调用函数只运行一次。它将计数器设置为零
（0），并返回一个函数表达式。
The self-invoking function only runs once. It sets the counter to zero (0), and returns a function expression.
这样add就成了一个函数。 精彩部分是它可以
访问父作用域中的计数器。
This way add becomes a function. The "wonderful" part is that it can access the counter in the parent scope.
这称为JavaScript闭包。这使得
函数可以拥有私有变量。
This is called a JavaScript closure. It makes it possible for a function to have "private" variables.
计数器受匿名函数范围的保护，
只能使用添加功能进行更改。
The counter is protected by the scope of the anonymous function, and can only be changed using the add function.
注意闭包是一个可以访问父作用域的函数，即使是
之后父函数已关闭。
Note A closure is a function having access to the parent scope, even after the parent function has closed.
解释并不错，但有些事情尚不清楚。为什么自我调用函数最好用？为什么嵌套的匿名函数不是自调用函数？当计数器已在其中返回时，为什么还必须返回整个匿名函数？
The explanation isn't bad, but a few things are unclear. Why was a self invoking function the best thing to use? Why is the nested anonymous function not the self invoking function? And why do you have to return the whole anonymous function when the counter is already returned inside of it?
推荐答案
闭包的概念可以解释为具有功能和它们的上下文。上下文在某种程度上附加到函数以解析捕获的变量（因此命名为closure？）。
The concept of closures could be explained as having functions and their contexts. A context is somewhat a kind of storage attached to the function to resolve variables captured (thus named closure?).
执行示例代码时：
var add = (function () {
var counter = 0; // This is promoted to the below's function context
return function () {return counter += 1;}
})();
您创建一个计数器变量的上下文被提升为匿名函数上下文，因此您可以从当前范围访问该变量。
You create a context where the counter variable is promoted to the anonymous function context thus you can access that variable from the current scope.
此图表或多或少地解释了它：
This diagram more or less explains it:
在这种情况下，X和Y由函数上下文捕获，并在该函数的所有执行中进行。
In this case, X and Y are captured by the function context and that is carried over all the executions of that function.
现在，这只是词汇环境的V8实现。
Now, this is just the V8 implementation of lexical environments.
请参阅Vyacheslav Egorov关于使用V8进行闭包实现的重要解释： Grokking V8闭包以获得乐趣（和利润？）
See Vyacheslav Egorov great explanation on closure implementations using V8: Grokking V8 closures for fun (and profit?)
这篇关于需要更多关于w3schools javascript封面示例的解释的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
