Deep understanding of JavaScript prototypes and closures (13)-Scope and context

The scope is described briefly above, and this article will take a deeper look at the combination of scope and context.

As we've described above, in addition to the global scope, each function creates its own scope, which is determined when the function is defined. Instead of being determined when the function is called .

Below we will follow the sequence of execution of the program, step by step to add each context. In addition, to the context of the friends who do not know, you can go to see the two previous articles:

Http://www.cnblogs.com/wangfupeng1988/p/3986420.html

Http://www.cnblogs.com/wangfupeng1988/p/3987563.html

In the first step, when the program is loaded, the global context environment is determined and the variables are assigned to the values as the program executes.

In the second step, the program executes to line 27th, calls FN (10), generates the context of the call to the FN function, presses the stack, and sets the context to the active state.

The third step, executes to the 23rd line, calls bar (100), generates the context of the call, presses the stack, and sets the status to active.

Fourth step, the bar (100) is completed after the 23rd line is executed. The bar (100) context is destroyed. Then execute line 24th, call Bar (200), then generate Bar (200) of the context, press stack, set to active state.

In the fifth step, the bar (200) call ends and its context is destroyed when the 24th line is executed. This returns to the FN (10) context and becomes active.

Sixth step, after the execution of the 27th line of code, FN (10) After execution, the FN (10) context is destroyed, and the global context is back to the active state.

It's over. Like the old lady's binding cloth--smelly and long!

Finally, we can link these pictures together to see.

It's very interesting to see the connection. scope is just a "site", an abstract concept in which there are no variables. The value of the variable to get from the execution context environment corresponding to the scope. Under the same scope, different invocations produce different execution contexts, which in turn produce values for different variables. Therefore, the value of a variable in the scope is determined during execution, and the scope is determined when the function is created .

So, if you want to find the value of a variable under a scope, you need to find the execution context in which the scope corresponds, and then look for the value of the variable .

Although this article is very long, but the text is less, the picture is mostly, the picture has the image display, everybody spends more than 10 minutes also can slowly read. However, this section is really important.

In the above code, we have not designed the case for cross-scope values, namely--free variables. Detailed content and listen to tell.

---------------------------------------------------------------------------

This article has been updated to the directory of in-depth understanding of JavaScript prototypes and closures, and more on the in-depth understanding of JavaScript prototypes and closures series.

Also, please pay attention to my Weibo.

Also welcome to follow my other tutorials-don't be afraid, are free!

"Microsoft petshop4.0 Source Interpretation Video" "Json2.js Source Interpretation video"

--------------------------------------------------------------------------

Deep understanding of JavaScript prototypes and closures (13)-Scope and context