The basis----scope chain of a function's closure

Understanding closures I feel the need to understand the following concepts and knowledge in advance:

Scope (chain), variable object (active object), execution environment.

Explain the concept in turn:

Scope: We know that the scope of a variable is the area in the program source code that defines the variable . (Rhino book) is divided into global scope and local scope. ( previous: Function arguments are also local variables, they are defined only within the function body.) function definitions can be nested, so there is a function scope.

function scope: Variables are defined in the body of the function in which they are declared and in any function within which the body of the function is nested. That is, a variable is defined in the function body, which is always defined within the function body, and nested functions nested within the function can also access the variable upwards.

See an example:

1 function f () {2     vari =0;3 function Test () {4         //var i = ten;5 Console.log (i);6     }7     //Console.log (i);8 test ();9 }Tenf (); 0

The variable I defined here can be accessed by the function test inside.

As with variable declarations, all variables declared within a function are always visible in the function body.

1 varScope ="Global";2 function f () {3       //var scope;4Console.log (scope);//undefined5     varScope ="Local";//defined, assigning local value to scope6Console.log (scope);//Local7}

As the above example, the function body scope defines initialization on line 5th, but the effect is equivalent to the definition of the third row without initialization. So the global variables defined by the first row are ignored.

Take a look at the scope chain:

Several concepts are presented in red Cookbook:

Execution Environment: the execution context of a variable or function defines what other data it had access to, as well as how it should Behave. Each execution context has a associated variable object upon which all of its defined variables and functions exist. This object was not accessible by code, but was used behind the scenes to handle data.

The execution environment of a variable or function defines the other data that the variable or function has access to, and also determines their respective behavior. ( a little bit like the scope of the Scopes ha.) Other data that can be accessed by variables and functions are placed in an environment, including in an object. Just like a circle. Each execution environment has a variable object associated with it (variable object), and all variables and functions defined in the environment are stored in the object. The code we write cannot access it, but the parser uses it in the background when it processes the data.

Therefore, the largest execution environment is the global environment, but also the outermost one. In a Web browser, the global execution environment is considered a Window object. Therefore, all global objects and functions exist as properties of the Window object. Also, when all the code in an execution environment is executed, the environment is destroyed, and all the variables and function definitions stored therein are destroyed. (The global execution environment will not be destroyed until the program exits, such as when it is closed.) ）

each function call have its own execution context. Whenever code execution flows into a function, the function ' s context is pushed onto a Context stack. After the function has finished executing, execution flow throughout an ECMAScript program.

What this phrase means is that each function has its own execution environment(first, all environments will form an environment stack). when a modern code executes into a function (that is, the code in the function is started), the execution environment of the function is pushed into the large environment stack, and when the function is executed, the large environment stack squeezes the function's environment stack (POPs) and returns control to the original execution environment. is to return to the original execution flow up.

When code executes in the execution environment, the scope chain of the variable object is created. The purpose of a scope chain is to provide an orderly access to the variables and functions that the environment has access to, without getting out of order. Come in a sequential order. The front end of the scope chain (or the closest, innermost, most inner) is always a variable object in the execution environment where the code currently executing is located. (in fact, the execution environment, is a relatively virtual concept, and variable object is a relatively real point, because the execution environment defined variables and functions are stored in the variable object.) )

If the execution environment is a function, its active object (activation object) is used as the variable object. The active object initially contains only one variable, the arguments object (which does not exist in the global environment). This is the function of the scope chain of the most front-end, the innermost, the scope chain on the next variable object is from the inclusion (that is, the external) environment, and the next is also from the next external environment, a layer of gradual outward peeling, know the outermost global environment. The variable object of the global environment is the last object on that scope chain.

The example on Red Book is very good:

1 varcolor ="Blue";2 function ChangeColor () {3     if(color = = ="Blue"){4color ="Red";5}Else {6color ="Blue";7     }8 }9 TenChangeColor ();

In the above example, the scope chain of the function ChangeColor () contains two objects: its own variable object (where the arguments object is defined), and the global variable object. A color variable can be accessed inside a function because the variable color can be found in the object on the scope chain of the function (in the global object).

Variables defined in a local environment can be used interchangeably with global variables in a local environment.

1 varcolor ="Blue";2 3 function ChangeColor () {4     varAnothercolor ="Red";5 function Swapcolor () {6         varTempcolor =Anothercolor;7Anothercolor =color;8color =Tempcolor; 9         //Here you can access Color,anothercolor and TempcolorqTen     } One     //Here you can access anothercolor and color, but you cannot access Tempcolor A Swapcolor (); - } - //you can only access color here. theChangeColor ();

This code has three execution environments: the global environment, the local environment of the ChangeColor (), and the local environment of the Swapcolor ().

There is a variable color and function ChangeColor () in the global environment. The local Environment of ChangeColor () has variable anothercolor and function Swapcolor. Swapcolor () has only variable tempcolor in the local environment. ChangeColor () can access variables Color,swapcolor can access variable color and anothercolor. However, the local environment of the Global Environment and ChangeColor () cannot access the variable Tempcolor.

The appeal relationship is clearly demonstrated:

Different colors represent different execution environments, from inside to outside, the internal environment can access all external environments through the scope chain, but the external environment cannot access any variables and functions of the internal environment. That is, you can search up, but you can't search down.

So the function Swapcolor () has a scope of three objects: the variable object of Swapcolor (), the variable object of ChangeColor (), and the global object. The local Environment of Swapcolor () will now search for variables and function names in its own variable object, and if not, search upwards. The scope chain of ChangeColor () contains only two objects: its own variable object and the global variable object, so it cannot access the environment of Swapcolor ().

See here, you can also understand why there is a definition of the scope chain, the scope chain is a group of objects, or a list of objects (linked lists). There are also summaries as follows:

• For JavaScript's topmost code, which does not contain code within any function definition, its scope chain contains only one object: the Global object.
• For a function that does not contain a nested function, its scope chain contains two objects: its own variable object and the global variable object.
• For a function that contains a nested function, its scope contains at least three objects: its own variable object, the outer,,,, known global variable object.

The basis----scope chain of a function's closure