[Study notes] "JavaScript in-depth series of execution context important attributes-variable objects" study notes

A true great god can speak knowledge in an orderly manner! , Stand on the shoulders of giants and learn the
learning address https://github.com/mqyqingfeng/Blog
Statement: The pictures and content are taken from the above link, here is just to record the study notes, please refer to the above link for the full version.

When the JavaScript code executes an executable code (executable code), it will create a corresponding execution context (execution context)

For each execution context, there are three important attributes:
-Variable Object (Variable Object, VO)
-Scope chain (Scope chain)
-this

Variable object

Focus: the process of creating variable objects

Variable objects are data scopes related to the execution context, and store variables and function declarations defined in the context.

Variable objects in different execution contexts are slightly different.

The variable object in the global context is the global object window

In the context of the function , an activation object (AO) is used to represent a variable object.

The active object and the variable object are actually the same thing, but the variable object is standardized or implemented by the engine and cannot be accessed in the JavaScript environment. Only when entering an execution context, the variable object of the execution context will be Activation, so it is called an activation object, and only the variable objects that are activated, that is, the various attributes on the active object, can be accessed. ??

The active object is created at the moment when it enters the function context, and it is argumentsinitialized by the properties of the function . argumentsAttribute value is Argumentsan object.

Execution process:
1. Enter the execution context (analysis phase) 2. Code execution (execution phase)
example:

function foo(a) {
    var b = 2;
    function c() {}
    var d = function() {};

    b = 3;
}

foo(1);

After entering the execution context, AO is

AO = {
    arguments: {
        0: 1,
        length: 1
    },
    a: 1,
    b: undefined,
    c: refrence to function c() {}，
    d: undefined
}

In the code execution stage, the code will be executed sequentially, and the value of the variable object will be modified according to the code.
After the above example is executed, the AO at this time is:

AO = {
    arguments: {
        0: 1,
        length: 1
    },
    a: 1,
    b: 3,
    c: refrence to function c() {}，
    d: refrence to FunctionExpression "d"
}

Summary:
1. Variable object initialization of global context is global object

2. The variable object initialization of the function context only includes Arguments objects

3. When entering the execution context, initial attribute values ​​such as formal parameters, function declarations, and variable declarations will be added to the variable object

4. In the code execution stage, the attribute value of the variable object will be modified again

console.log(foo);

function foo(){
    console.log("foo");
}

var foo = 1;

Will print the function instead of undefined

This is because when entering the execution context, the function declaration is processed first, and the variable declaration is processed second. If the variable name is the same as the formal parameter or function that has been declared, the variable declaration will not interfere with such properties that already exist.