Talk about my understanding of JavaScript prototypes and closure series (random notes 9)_javascript skills

Related reading: Talk about my understanding of JavaScript prototypes and closure series (Shuishou Note 6) Talk about my understanding of JavaScript prototype and closure series (Suishou Note 8)

Scope

Quoting the definition of scope from "JavaScript Language Essence and Programming Practice":

Variable scope is also called the visibility of variables. Variable scope completes the concealment of information, which is to solve the problem of "fragmentation".

There is no block-level scope in js (there is a let in ES6, which can be declared in {}, if, and for, and the scope is limited to the block level. There is no variable promotion for variables declared by let! We will not talk about it here This, because I saw it by chance).

When we write code, we should not declare variables in the "block". We should declare them at the beginning of the code to avoid ambiguity.

 for(var i = 0; i < 10; i++) { //不好的声明方式
 //...
}
console.log(i);
/*----------------------------------------------*/
var i = 0; //好的声明方式
for(i = 0; i < 10; i++) {
 //....
}
console.log(i); 

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

When we declare variables, the global code is declared at the front end, and variables declared in functions must be declared in front of the function body. At the same time, the "var" operator must be used when declaring variables.

 var a = 10,  //全局作用域
 b = 20;
function fn() { //fn函数作用域
 var a = 100,
  c = 300;
 function bar() { //bar函数作用域
  var a = 1000,
   d = 4000;
 }
} 

Global code, fn function and bar function will all form a scope. Scopes have a superior-subordinate relationship, and the superior-subordinate relationship depends on the scope in which the function is created. The bar function is created under the fn function scope. The "fn function scope" is the superior of the "bar function scope".

The biggest use of scope is to isolate variables. Variables with the same name in different scopes will not conflict

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

The scope is determined when the function is defined, not when the function is called.

1. The global context environment has been determined when the program is loaded, and variables are assigned values ​​as the program is executed.

2. Execute to line 36, call fn(10), create the execution context of the fn function, push the stack, and set this context to the active state.

3. Execute to line 32, call bar(100), create the execution context of the bar(100) function, push the stack, and set this context to the active state.

4. After bar(100) is called, it is popped off the stack and the bar(100) function context is destroyed. Then execute line 33, call bar(200), create the execution context of the bar(200) function, push the stack, and set this context to the active state.

5. After the call to bar(200) is completed, it is popped off the stack and its context is destroyed. Control is now passed to the fn(10) context, which becomes active again.

6. At this time, fn(10) is called, popped off the stack, and its context is destroyed. Control is transferred to the global execution context.

The execution process of this piece of code is complete at this point.

Then borrow the complete picture from the original author:

Summary:

The scope is just a "turf", and the value of the variable must be obtained through the execution context corresponding to the scope. Under the same scope, different calls will generate different execution contexts, and thus different variable values. Therefore, the value of the variable in the scope is determined during execution, but the scope is determined when the function is created. Therefore, if you want to find the value of a variable in a scope, you need to find the execution context corresponding to this scope, and then find the value of the variable in it.