How to explain closures to someone who understands the concept of JavaScript closures (such as functions, variables, etc.), but does not understand closures themselves?
I've looked at the Scheme examples given on Wikipedia, but unfortunately they didn't help.
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
In JavaScript, each function maintains a link to its external lexical environment. The lexical environment is a map of all names (such as variables, parameters) and their values in a scope.
So, whenever you see the
functionkeyword, code inside that function can access variables declared outside the function.function foo(x) { var tmp = 3; function bar(y) { console.log(x + y + (++tmp)); // 将输出 16 } bar(10); } foo(2);This will output
Function16because the functionbarcloses the parameterxand the variabletmp, which both exist in the outer function# in the lexical environment of ##foo.bar
Functions are not required to, together with its link to the lexical environment of functionfoo, forms a closure.returnto create a closure. By declaration alone, each function encloses its enclosing lexical environment, forming a closure.
function foo(x) { var tmp = 3; return function (y) { console.log(x + y + (++tmp)); // 也将输出 16 } } var bar = foo(2); bar(10); // 16 bar(10); // 17bar
However, sincecan still reference the parameterxand variabletmp, even though they are no longer directly in scope.tmp
The simplest example of a closure is:still exists withinbar's closure, it can be incremented. It will be incremented each timebaris called.var a = 10; function test() { console.log(a); // 将输出 10 console.log(b); // 将输出 6 } var b = 6; test();ec
Every function creates a closure because every function has a link to its external lexical environment. Please note that what is visible in the closure is the variable itself, not the copy.is created. In addition to the function parameters and the target object, this execution context also receives a link to the lexical environment of the calling execution context, which means variables declared in the external lexical environment (in the example above, that is,aandb) can be accessed fromec.A closure is a pair of:
The lexical environment is part of every execution context (stack frame) and is the mapping between identifiers (i.e. local variable names) and values.
Every function in JavaScript maintains a reference to its external lexical environment. This reference is used to configure the execution context created when the function is called. This reference enables code inside the function to "see" variables declared outside the function, regardless of when and where the function is called.
If a function is called by another function, a series of references to the external lexical environment will be created. This chain is called the scope chain.
In the following code,
innerforms a closure with the lexical environment of the execution context created whenfoois called, and the closure contains the variablesecret:function foo() { const secret = Math.trunc(Math.random() * 100) return function inner() { console.log(`The secret number is ${secret}.`) } } const f = foo() // 无法直接从外部访问`secret` f() // 检索`secret`的唯一方法是调用`f`