It's for javascript learners.
Please note how memory management works here. Although makeCounter() call finished some time ago, its Lexical Environment was retained in memory, because theres a nested function with [[Environment]] referencing it. Generally, a Lexical Environment object lives as long as there is a function which may use it. And only when there are none remaining, it is cleared. 6. The call to counter() not only returns the value of count , but also increases it. Note that the modification is done in place. The value of count is modified exactly in the environment where it was found. So we return to the previous step with the only change the new value of count . The following calls all do the same. 7. Next counter() invocations do the same. The answer to the second question from the beginning of the chapter should now be obvious. The work() function in the code below uses the name from the place of its origin through the outer lexical environment reference: So, the result is "Pete" here.
id: 96a5b54b129684b91b46b728505613a6 - page: 340
But if there were no let name in makeWorker() , then the search would go outside and take the global variable as we can see from the chain above. In that case it would be "John" .
id: 99ee932656dad77bd8e270c35f73311f - page: 341
Closures There is a general programming term closure, that developers generally should know. A closure is a function that remembers its outer variables and can access them. In some languages, thats not possible, or a function should be written in a special way to make it happen. But as explained above, in JavaScript, all functions are naturally closures (there is only one exclusion, to be covered in The "new Function" syntax). That is: they automatically remember where they were created using a hidden [[Environment]] property, and all of them can access outer variables. When on an interview, a frontend developer gets a question about whats a closure?, a valid answer would be a definition of the closure and an explanation that all functions in JavaScript are closures, and maybe few more words about technical details: the [[Environment]] property and how Lexical Environments work.
id: 56739125c599bffadc7ba765831caed7 - page: 341
Code blocks and loops, IIFE The examples above concentrated on functions. But a Lexical Environment exists for any code block {...} . A Lexical Environment is created when a code block runs and contains block-local variables. Here are a couple of examples. If In the example below, the user variable exists only in the if block: When the execution gets into the if block, the new if-only Lexical Environment is created for it. It has the reference to the outer one, so phrase can be found. But all variables and Function Expressions, declared inside if , reside in that Lexical Environment and cant be seen from the outside. For instance, after if finishes, the alert below wont see the user , hence the error. For, while For a loop, every iteration has a separate Lexical Environment. If a variable is declared in for , then its also local to that Lexical Environment: for (let i = 0; i < 10; i++) { // Each loop has its own Lexical Environment // {i: value} }
id: 8c2f1cd718a36126e3493a78dc747c43 - page: 342