Closures in JavaScript

Closures are an important feature of JavaScript, very powerful, and can be used to perform complex computations, which is not easy to understand, especially for people who have previously engaged in object-oriented programming, which makes JavaScript awareness and programming more difficult. This is especially true when looking at some open source JavaScript code, which is no different from reading the heavenly book.

Generally, people know a thing, according to the previous experience, compare and summarize, in the brain to build a model to understand it, but JavaScript and object-oriented programming is "not comparable", the most obvious is some too written, always feel "weird", not to mention, Some of its advanced features. If you say "object" is quite regular when it comes to object-oriented programming, there's no regularity in JavaScript, it's everywhere, even where you don't expect it.

First look at two pieces of code.

Example 1:

Example 2:

Example 1 and Example 2 are closures, just 2:1 complex, and even more complex notation, such as returning multiple closures.

Example 1, after the script is loaded into memory, does not calculate the value of the variable smessage for the function SayHelloWorld (). The function captures the value of smessage only for later use, that is, the interpreter knows to check the value of smessage when calling the function. Smessage will be assigned the message "Hello World" when the function calls SayHelloWorld () (The last line).

Example 2, the function Addnum () includes the function Doadd () (closure). An intrinsic function is a closure because it gets the parameters iNum1 and iNum2 of the external function and the value of the global variable Ibasenum. The last step of Addnum () calls Doadd (), adds two parameters and global variables, and returns their sum.

The important concept to master here is that the Doadd () function does not accept parameters at all, and the values it uses are obtained from the execution environment.

Closures, as described by ECMAScript, the lexical (lexically) represents a function that includes variables that are not evaluated, and functions can use variables defined outside the function, which means that the current scope always has access to variables in the outer scope. A function is the only structure in JavaScript that has its own scope, so the creation of closures relies on functions. Functions inside the function access the variables (local variables, formal parameters) of the function they are in, which are affected by the intrinsic function, and when called outside of the function, a closure is formed. The inner function is executed after its external function returns.

Example 3:

Description: Foo is an external function of bar, BA is the intrinsic function of Foo, A is a local variable of foo, bar accesses the local variable a of Foo, and Foo returns bar. Bar is called outside of Foo. When Baz () is executed, the closure causes the JavaScript garbage collection mechanism not to reclaim the resources that Foo occupies. Because, Baz actually points to the intrinsic function of Foo Bar,bar is dependent on the local variable a of foo. Thus, after executing var baz=foo (), Baz actually points to bar, not foo. Bar accesses the local variable a of Foo, when Baz () is executed, A is 20. This creates a closure.

If you think of Foo as a package, a closure is formed according to the tip of the cutter. The result is the persistence of local variable A (as shown in Example 4). The following code is not a closure. Displays 20 no matter how many times it is executed.

Reference from: Http://www.toutiao.com/a6459693220359045645/?tt_from=weixin&utm_campaign=client_share&app=news_ Article&utm_source=weixin&iid=14394189501&utm_medium=toutiao_ios&wxshare_count=1

Closures in JavaScript