Closure issues in a detailed

Source: Internet
Author: User

One, what is closures?
The "official" explanation is that the so-called "closure" refers to an expression (usually a function) that has many variables and an environment in which these variables are bound, and therefore these variables are also part of the expression.
It is believed that very few people can read this sentence directly because he describes it as too academic. I want to use how to create a closing package in JavaScript to tell you what a closure is, because skipping the closure is a straightforward way to understand the definition of closures. Look at the following code:
function A () {
var i=0;
Function B () {
alert (++i);
}
return b;
}
var C = A ();
C ();
There are two features of this code:
1. function b is nested inside function A;
2, function a returns function B.
So after executing var c=a (), the variable C actually points to function B, and then C () pops up a window showing the value of I (first 1). This code actually creates a closure, why? Because the variable C outside of function A refers to function B in function A, that is:

When function A's intrinsic function B is referenced by a variable outside of function A, a closure is created.

I guess you still don't understand closures, because you don't know what the closure does, so let's go ahead and explore.

What is the role of closures?
In short, the function of a closure is that after a executes and returns, the closure makes the garbage collection mechanism of the JavaScript GC does not reclaim the resources used by a, because the execution of the internal function B of a requires a dependency on the variables in a. This is a very straightforward description of the effect of closures, unprofessional and not rigorous, but the general meaning is that, understanding closures need a gradual process.
In the above example, because the existence of a closure causes function A to return, I in a always exists, so that every time C (), I is added 1 after the alert out of the value of I.

So let's imagine another situation where a returns a function B, which is completely different. Since a executes, B is not returned to the outside world of a, only a is referenced by a, and at this point a will only be referenced by B, so functions A and B are referenced by each other but are not disturbed by the outside world (referenced by the outside world), functions A and B will be collected by GC. (The garbage collection mechanism for JavaScript will be described in more detail later)

Third, the microcosm within the closures
To gain a deeper understanding of the relationship between closures and function A and nested function B, we need to introduce several other concepts: the function's execution environment (excution context), the active object (call object), scope (scope), scope chain (scope chain). Take function A from definition to execution as an example to illustrate these concepts.

1, when defining function A, the JS interpreter will set the scope chain of function A (scope chain) to the "Environment" where a is located, and if a is a global function, only the window object in scope chain.
2, when function a executes, a will enter the corresponding execution environment (excution context).
3, in the process of creating the execution environment, first adds a scope property for a, that is, the scope of a, whose value is the scope chain in the 1th step. That is, the scope chain of the a.scope=a.
4. The execution environment then creates an active object (call object). The active object is also an object with properties, but it does not have a prototype and is not directly accessible through JavaScript code. After the active object is created, add the active object to the top of the scope chain of a. At this point A's scope chain contains two objects: A's active object and the Window object.
5, the next step is to add a arguments property on the active object, which holds the arguments passed when the function A is called.
6. Finally, the reference of all function A's formal parameters and internal function B is added to the active object of a. In this step, the definition of function B is completed, so as in the 3rd step, the scope chain of function B is set to the environment defined by B, which is the scope of a.

This completes the entire function A from definition to execution. At this point a returns a reference to function B to C, and the scope chain of function B contains a reference to the active object of function A, which means that B can access all the variables and functions defined in a. Function B is referenced by C and function B relies on function A, so function A is not recycled by GC after it returns.

When function B executes, it will be the same as the above steps. Therefore, the scope chain of execution B contains 3 objects: The active object of B, the active object of a, and the Window object, as shown in:

, when accessing a variable in function B, the search order is to search for its own active object, and if it exists, returns if there is no active object that will continue to search for function A, and then finds it until it is found. Returns undefined if none of the entire scope chain is found. If the prototype prototype object exists in function B, it finds its own prototype object after it finds its own active object, and then continues to look for it. This is the variable lookup mechanism in JavaScript.

Four, closure of the application scenario
1, the security of the variables within the protection function. For example, in the first example, function A can only be accessed by function B, and cannot be accessed by other means, thus protecting the security of I.
2. Maintain a variable in memory. Still as in the previous example, because of the closure, the function A in the I has been in memory, so each execution C (), will give I self plus 1.
The above two points are the most basic application scenarios for closures, and many of the classic cases originate from this.

V. JavaScript's garbage collection mechanism
In JavaScript, if an object is no longer referenced, the object is recycled by the GC. If two objects are referenced by each other and are no longer referenced by the 3rd, then the two mutually referenced objects are also recycled. Because function A is referenced by B and B is referenced by a c outside of a, this is why function A is not recycled after execution.

Closure issues in a detailed

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.