JS Base---What is a closure? How is it formed?

Source: Internet
Author: User

1. Closures

  Let's look at a simple example

function A () {  varfunction  B () {alert (++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.
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.

When defining function A, the JS interpreter sets the scope chain of function A to the "environment" where a is located, and if a is a global function, only the window object is in scope chain.
When the function A is executed, a is entered into the appropriate execution environment (excution context).
During the creation of the execution environment, a scope property, the scope of a, is first added for a, and the value is the scope chain in step 1th. That is, the scope chain of the a.scope=a.
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.
The next step is to add a arguments property on the active object, which holds the arguments passed when the function A is called.
Finally, the reference of all function A's 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, at execution time, B's scope chain contains 3 objects: The active object of B, the active object of a, and the Window object, when a variable is accessed in function B, the search order is:
1. Search for the active object itself first, if present, return if there is no active object that will continue to search for function A, and then find until it is found.
2. 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.
3. If the entire scope chain cannot be found, the undefined is returned.

Summary, two important words are mentioned in this paragraph: definition and execution of functions. It is mentioned in the article that the scope of the function is determined when the function is defined, not when it is executed (see steps 1 and 3). Use a piece of code to illustrate the problem:

function f (x) {var g = function () {return x;} return g;} var h = f (1); alert (H ());

The variable h in this code points to the anonymous function (returned by G) in F.

Assuming that the scope of the function h is determined by the execution alert (h ()), then the scope chain of H is: H's active object->alert the active object->window object.
Assuming that the scope of the function h is defined at the time of definition, the anonymous function pointed to by H has been scoped at the time of definition. Then, at execution time, the scope chain of H is: H's active object->f the active object->window object.
If the first hypothesis is true, the output value is undefined; if the second hypothesis is true, the output value is 1.

The result of the operation proves that the 2nd hypothesis is correct, stating that the scope of the function is indeed determined when the function is defined.

2. Scope

is the scope of access to variables and functions

Global scope:
1. The outermost function and the variables defined outside the outermost function have global scope
2. All variables that are directly assigned to the definition are automatically declared as having global scope
3. Properties of all window objects have global scope
The built-in properties of the Window object all have global scope, such as Window.name, Window.location, Window.top
Local scope: Inside the function

3. Scope Chain

When a function is created, its scope chain is populated with data objects that can be accessed by creating the scope of this function.

4. Prototype objects

  A parent object that holds the common members of a child object of the same type centrally, and is created automatically when the constructor is defined. When you use a constructor to create a child object, the child object inherits the constructor's prototype object automatically. The constructor is responsible for creating an object of the specified type, and the prototype object is responsible for saving the APIs common to that type of child objects.

5. Prototype chain

  The members (properties and methods) of all objects are saved, and the order in which members are used is defined: first with their own members and not by themselves, the prototype chain is looked up to the parent object

JS Base---What is a closure? How is it formed?

Related Article

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.