Let's talk about my understanding of the JavaScript prototype and closure series (note 9 ),

Let's talk about my understanding of the JavaScript prototype and closure series (note 9 ),

Related reading: About my understanding of the JavaScript prototype and closure series (note 6) about my understanding of the JavaScript prototype and closure series (note 8)

Scope

Reference the definition of scope in JavaScript language essence and programming practices:

The variable scope is also called the visibility of variables. The variable scope is used to conceal information, that is, to handle the "data cut" problem.

In js, there is no block-level scope (ES6 has a let, which can be declared in {}, if, for, and the scope is limited to block-level. The variable declared by let does not exist. The variable is promoted! I will not talk about this here, because I also happen to see it .).

When writing code, we should not declare variables in blocks. We should declare the variables at the beginning of the Code to avoid ambiguity.

For (var I = 0; I <10; I ++) {// bad declaration method //...} console. log (I);/* -------------------------------------------- */var I = 0; // a good declaration method for (I = 0; I <10; I ++) {//....} console. log (I );

In addition to the global scope, javascript also has a function scope.

When declaring a variable, the global code is declared at the frontend, and the variable declared in the function must be declared before the function body. At the same time, the "var" operator must be used to declare variables.

Var a = 10, // global scope B = 20; function fn () {// fn function scope var a = 100, c = 300; function bar () {// bar function scope var a = 1000, d = 4000 ;}}

Global Code, fn function, and bar function form a scope. The scope has a parent-child relationship. The parent-child relationship depends on the scope in which the function is created. The bar function is created under the fn function scope, and the "fn function scope" is the upper level of the "bar function scope.

The maximum use of a scope is to isolate variables. variables with the same name in different scopes do not conflict.

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

The scope is determined when the function is defined, rather than when the function is called.

 

1. When the program is loaded, it has determined the Global Context Environment and assigned values to the variables as the program executes.

 

2. Execute 36 rows, call fn (10), create the execution context of the fn function, press the stack, and set the context to active.

 

3. Execute 32 rows, call bar (100), create the execution context of bar (100) function, press the stack, and set the context to active.

 

4. bar (100) is called and the Context Environment of bar (100) function is destroyed when the stack is output. Next, execute 33 rows, call bar (200), create the execution Context Environment of bar (200) function, press the stack, and set the context to active state.

 

5. bar (200) is called and its context environment is destroyed when the stack is released. At this time, the control is handed over to the fn (10) Context Environment, and it becomes active again.

 

6. At this time, fn (10) is called and its context environment is destroyed when the stack is released. The control is handed over to the global execution context.

 

At this point, the code execution process is complete.

Then, use the complete diagram of the original author:

Summary:

The scope is just a "territory". You need to obtain the value of the variable through the execution Context Environment corresponding to the scope. In the same scope, different calls will generate different execution context environments and then generate different variable values. Therefore, the value of the variable in the scope is determined during execution, while the scope is determined when the function is created. Therefore, if you want to find the value of a variable under a scope, you need to find the execution Context Environment corresponding to this scope, and then find the value of the variable.

Articles you may be interested in:

• Modularization of JavaScript: encapsulation (closure), inheritance (prototype) Introduction
• Learning javascript closures, prototypes, and anonymous Functions
• My understanding of the JavaScript prototype and closure series (note 6)
• My understanding of the JavaScript prototype and closure series (note 8)