Js scope is detailed and active object execution context is explained in detail, Xiaobai can understand!

Let me show you a few lines of code first;
var demo = “ian”;
function fuc () {
console.log (demo); // result: ian
}
fuc ();

Obviously fuc () prints the demo in the whole world, the following focuses on the analysis principle;

First understand a term called Execution Context (Exection Context) , and some people call it the execution context. The execution environment contains all the variables and function names of a function (global). Whenever the function starts executing, an execution environment is generated, which is destroyed when all code is executed (the global environment is destroyed after the program exits).

When creating the execution environment, the scope chain scope will be created , and the different scopes are linked together by the scope chain ; after creating the execution environment, this, arguments (which does not exist globally) will be used to create the active object. The front end of the scope chain (0) is always the current function object (the global execution environment is window), and the attribute value in the scope of the subsequent scope chain;
then the above function gives a chestnut:
Insert picture description here

Back to the original question: there is no demo variable in the scope of the fun function (scop [0]), but it will continue to search for elements along the scope chain and find the demo in the global scope (scop [1]) And print, the result is "ian";

AO——activation object

The active object generated immediately before the function execution; see the following piece of code
console.log (x);
var x = 5;

//result:undefined;

fuc1();
function fuc1(){
var a=1;
console.log(a);
console.log(b);
var b=2;
console.log(b);
}

//result:1 undefined

The above two questions have the teacher's summary formula: variable declaration promotion, and function declaration overall promotion. Let's look at the principle below:
AO (globally called GO) will be generated every time the function is executed. Follow these steps
1. Create an AO object;
2. Find variable declarations and formal parameters, with variable names / parametric names as AO objects The property, the property value is undefined
3. The formal parameters are unified
4. Find the function declaration; the function name is the property of the AO object, the property value is undefined
Use the above function to give a chestnut:

1. First create the AO object
AO {}

2. Find variable declarations and formal parameters,
AO {a: undifined;
b: undifined
} // In this example, only variables a and b have no formal parameters

3. Unification of formal parameters
AO {a: undifined;
b: undifined
} // Since there are no actual parameters in this example, there is no change after this step compared to before

4 Find the function declaration
AO {a: undifined;
b: undifined
}
// The function in this example does not declare a new function

Next, start executing the code in the function from top to bottom according to the rules of JS.
First execute a = 1; * Note: here split var a = 1 into var a; a = 1; the variable has just been declared, so here Just need to assign the value to ok;

After execution, the AO is: {
a: 1;
b: undifined
}

Then continue to execute console.log (a); print a // result: 1
and then execute console.log (b); // result: undefined and
then execute b = 2:
AO is: {
a: 1;
b: 2;
}

Then execute console.log (b); // result: 2

The author is also a rookie who is just getting started. There are some places where the wording is not rigorous.

@author:JFlyhak
@email:[email protected]

Published 3 original articles · Liked5 · Visits168

Guess you like

Origin blog.csdn.net/qq_44621394/article/details/90245635