JavaScript closures have become a subject of confusion for some developers. While all JavaScript functions are closures, a specific subset is of particular theoretical interest. This article aims to clarify the concept and determine which of two code blocks accurately utilizes closures.
Understanding Closures:
A closure is a function that captures and maintains access to variables from its enclosing scope, even after that scope is no longer active. In essence, a closure is a function that has a memory and can access data from its parent scope, known as "parent scope variables" or "upvalues."
Identifying Closures:
To determine if a function is a closure, we must examine its variables. Functions that have no non-local variables (i.e., freely variable variables) cannot be closures. Functions with non-local variables must be referenced from outside their parent scope to become closures.
Case 1: Friend's Program
<code class="javascript">for(var i = 0; i < 10; i++) { (function(){ var i2 = i; setTimeout(function(){ console.log(i2); }, 1000) })(); }</code>
In this case, the function lacks any closed-over parent scope variables and is therefore not a closure. However, the inner function passed to setTimeout is a closure because it captures and maintains access to the free variable i2.
Case 2: Author's Program
<code class="javascript">for(var i = 0; i < 10; i++) { setTimeout((function(i2){ return function() { console.log(i2); } })(i), 1000); }</code>
Here, the inner function maintains access to the free variable i2 and remains a closure even when referenced outside its parent scope.
Conclusion:
In both cases, closures are utilized. The author's program employs a closure to properly capture the value of i. By returning another function and passing it to setTimeout, the inner function can access the closed-over variable i2. This ensures that the correct value is printed to the console after the delay.
The above is the detailed content of Are Anonymous Functions Always Closures in JavaScript?. For more information, please follow other related articles on the PHP Chinese website!