function scope of JS and block-level scope __ Data structure

One, the scope of JS

JS In addition to the global scope, there are function scopes.

Well, there's also a block level scope. Two, the difference between function scopes and block-level scopes

When the code is viewed as a iife, the global scope is actually a function scope.

So what is the difference between a function scope and a block-level scope ?

function scope: Variables are visible everywhere within defined functions and nested child functions;

Block-level function field: A variable is reclaimed immediately after leaving the defined block-level code.

So why is there such a difference between the two ?

Because within the scope of a function, a variable declaration has a process of elevating the hoisting.

Figure 2-1

The LET-defined variable has a block-level scope, which is to be said later.

If the var-defined variable does not have the hoisting process as a let-defined variable, then both should be referenceerror, but the result is that B is undefined, stating that B has been promoted and the effect is as follows:

Figure 2-2 III, hoisting

There are only two situations in JS where ascension occurs: A variable is declared (if a variable is defined, it is separated into a declaration and assignment, a declaration operation is extracted, the function is a first-class variable), or a function declaration is defined.

Figure 3-1

It can be seen that the mere declaration will ascend,

Defines a variable, it extracts its declaration action elevation,

The function declaration is fully elevated.

What if there is a renaming at the time of Ascension ?

As shown in Figure 3-2, the code before the actual run should be figure 3-3, as described above

Then why does var a not overwrite the definition of function A () {} so that the first one is printed as undefined.

Because the compiler encounters a variable declaration (a function expression can be understood to include a declaration and an assignment), it first looks at the current scope, declares the variable if it does not exist, and ignores the declaration if it exists. So the code that the engine actually receives should be figure 3-4:

Figure 3-4

Be careful not to put a Is confused with an implicit global variable . four, block-level scopes

Well, there are block-level scopes in JS. exception caught by 4.1 catch

Figure 4-1, the catchblock catches exceptions that are visible only in the catch block ,

However, other variables defined in the CATCH block are still part of the entire function scope. 4.2 Let keyword

As shown in Figure 4-2, a let- defined variable obeys a block-level scope, does not ascend, and does not function within the entire functional domain .

Figure 4-2 4.3 const keyword

The variable defined by const is based on let and, as shown in Figure 4-3, increases the restriction that must be assigned to a constant at the time of Declaration, as shown in Figure 4-4.

Figure 4-3

Figure 4-4

Five, other 5.1 The error appearing

Referenceerror: Scope discriminant error, the search through the scope chain can not find the corresponding variable.

TypeError: You can search for variables through scopes, but the operation of variables is illegal.

SyntaxError: Syntax error

function declarations in 5.2 hoisting

The function declaration directly defined in the function body, the whole will advance;

However, the function declaration defined in the block will only elevate its declaration portion and not allocate the actual memory space. As shown in Figure 5-1

Figure 5-1