JavaScript variable object 3: two stages of execution Context

Now we have reached the core point of this article. The execution context code is divided into two basic stages for processing: Enter

Now we have reached the core point of this article. The execution context code is divided into two basic stages for processing:

1. Enter execution Context
2. Execute Code

Changes to variable objects are closely related to these two phases.

Note: The processing of these two phases is a general action and is irrelevant to the context type (that is, the global context and function context are the same ).

Enter execution Context

When you enter the execution context (before code execution), VO contains the following attributes (as mentioned earlier ):

• All the parameters of the function (if we are in the context of function execution )?-The property of a variable object consisting of a name and a corresponding value is created. If no corresponding parameter is passed, the attributes of a variable object consisting of the name and undefined value will also be created.
• All function declarations (FunctionDeclaration, FD )?-The property of a variable object consisting of a name and a corresponding value (function object) is created. If the variable object already has an attribute with the same name, the property is completely replaced.
• All variable declarations (var, VariableDeclaration )?-Attributes of a variable object composed of the name and the corresponding value (undefined) are created. If the variable name is the same as the declared parameters or functions, the variable declaration does not interfere with the existing attributes.

Let's take an example:

function test(a, b) {  var c = 10;  function d() {}  var e = function _e() {};  (function x() {});} test(10); // call

When entering the context of the test function with the parameter 10, AO performs as follows:

AO(test) = {  a: 10,  b: undefined,  c: undefined,  d: 
 
    e: undefined};
 

Note that AO does not contain the function "x ". This is because "x" is a function expression (FunctionExpression, abbreviated as FE) rather than a function declaration. function expressions do not affect VO. In any case, the function "_ e" is also a function expression, but as we will see below, because it is assigned to the variable "e ", therefore, it can be accessed by the name "e. Function declaration FunctionDeclaration differs from function expression FunctionExpression. For details, refer to the previous topic article.

After that, the second stage of processing the context code is executed.

Code Execution

In this period, AO/VO already has attributes (however, not all attributes have values, and most attribute values are still the default undefined values ). In the previous example, AO/VO was modified as follows during code interpretation:

AO['c'] = 10;AO['e'] = 
 
  ;
 

Note that since FunctionExpression "_ e" is saved to the declared variable "e", it still exists in the memory. FunctionExpression "x" does not exist in AO/VO. That is to say, if we want to call the "x" function, no matter before or after the function is defined, an error "x is not defined" will occur. unsaved function expressions can be called only in their own definitions or recursion.

Another typical example:

alert(x); // function var x = 10;alert(x); // 10 x = 20;function x() {}; alert(x); // 20

Why does the first alert "x" return a function, and it still accesses "x" before "x" is declared? Why not 10 or 20? Because, according to the canonicalized function declaration is filled in when the context is entered; the consent period, when the context is entered, there is a variable Declaration "x", as we said in the previous stage, variable declaration follows the function declaration and formal parameter declaration in sequence, and enters the context stage, the variable declaration does not interfere with the existing function declaration of the same name or formal parameter declaration in VO. Therefore, when entering the context, the VO structure is as follows:

VO = {}; VO ['X'] =
 
  
// Find var x = 10; // If function "x" has not been declared, // at this time, the value of "x" should be undefined // but the variable declaration in this case does not affect the value of function with the same name VO [' x'] =
  
 

Then, in the code execution stage, VO makes the following changes:

VO['x'] = 10;VO['x'] = 20;

We can see this effect in the second and third alert.

In the following example, we can see that the variables are put into VO at the context stage. (Because, although some else code will never be executed, the variable "B" still exists in VO .)

If (true) {var a = 1 ;}else {var B = 2 ;}alert (a); // 1 alert (B); // undefined, B is not declared, but B is undefined.

Additional reading

The topic list of this article is as follows:

1. How should we understand the working principle of the JavaScript engine?
2. JavaScript exploration: the importance of writing maintainable code
3. JavaScript exploration: exercise caution when using global variables
4. JavaScript exploration: var pre-parsing and side effects
5. JavaScript exploration: for Loop (for Loops)
6. JavaScript exploration: for-in loop (for-in Loops)
7. Exploring JavaScript: Prototypes is too powerful
8. JavaScript: eval () is the devil"
9. JavaScript exploration: Using parseInt () for Numerical Conversion
10. Exploring JavaScript: Basic coding specifications
11. JavaScript exploration: function declaration and function expression
12. JavaScript exploration: Name function expressions
13. JavaScript: function name in the debugger
14. JavaScript: JScript Bug
15. JavaScript exploration: Memory Management of JScript
16. Exploring JavaScript: SpiderMonkey's quirks
17. JavaScript exploration: an alternative solution to naming function expressions
18. JavaScript exploration: Object
19. JavaScript exploration: Prototype chain
20. JavaScript exploration: Constructor
21. JavaScript probing: executable context Stack
22. Execution context 1: Variable object and activity object
23. Execution context 2: Scope chain Scope Chains
24. Execution context 3: Closure Closures
25. Execution context 4: This pointer
26. Exploring JavaScript: Powerful prototype and prototype chain
27. JavaScript Functions 1: function declaration
28. JavaScript function 2: function expressions
29. JavaScript function 3: function expressions in a group
30. JavaScript function 4: function Constructor
31. JavaScript variable object 1: VO Declaration
32. JavaScript variable object 2: VO in different execution contexts
33. JavaScript variable object 3: two stages of execution Context
34. JavaScript variable object IV: Variables
35. Property of the JavaScript variable object __parent _
36. JavaScript scope chain 1: Scope chain Definition
37. JavaScript scope chain 2: function Lifecycle
38. JavaScript scope chain 3: Scope chain features
39. JavaScript closure 1: Introduction to closures
40. JavaScript closure 2: Implementation of closure
41. JavaScript closure 3: Closure usage

Address of this article: http://www.nowamagic.net/librarys/veda/detail/1672,welcome.