Pre-compilation and execution of JavaScript

The JavaScript engine is not an article-by-article execution of JavaScript code, but rather a fragment of code blocks to explain execution. The so-called code block is the code snippet separated by the <script> tag.

There are two stages in the entire code block, the precompilation phase and the execution phase

First, the compilation phase

For common compiled languages (for example, Java), the compilation steps are divided into: lexical analysis, parsing, semantic checking, code optimization, and byte generation.

For interpreted languages (such as JavaScript), the syntax tree is obtained through lexical analysis and parsing, and it is possible to begin interpreting the execution.

(1) Lexical analysis is to convert a character stream (char stream) into a tick stream (token stream), just like an English sentence with one word independent translation.

(2) syntax analysis to get a syntax tree, for example:

Conditional statement if (typeof a = = "undefined") {a = 0;} else {a = A;} alert (a);

When the JavaScript interpreter constructs the syntax tree, if it finds that it cannot be constructed, it reports a syntax error and ends the parsing of the entire block of code.

(3) "function" is a citizen! In the compile phase, the function of the definition will be executed first, and all VAR variables will be created, and the default value is undefined to improve the execution efficiency of the program!

When the JavaScript engine parses the script, it processes all declared variables and functions during the precompiled period! and it is pre-declaring variables, and then pre-defined functions! (A variable promotion is a function promotion before a variable is promoted.)

JavaScript syntax uses lexical scopes (lexcical scope), meaning that JavaScript variables and function scopes are determined at the time of definition (code writing determines function scope, The function call execution determines the execution context and scope chain, rather than the execution time, because the lexical scope depends on the source code structure, so the JavaScript interpreter only needs static analysis to determine the scope of each variable, function, which is also known as Static scope.

Second, JavaScript execution process

Declares a concept: the execution context. That is, the execution environment of the current code, JS's operating environment includes: (1) Global Environment (2) Function environment (function call execution, execution context push function call stack) (3) Eval, try to avoid using

Example: Var color= "Red";
function GetColor () {
var ancolor= "Blue";
function Chcolor () {
Ancolor=color;
}
Chcolor ();
}
GetColor ();

Analysis: Start the function call stack bottom is the global context, when the code executes to GetColor (), pushes GetColor () into the function call stack, executes to Chcolor (), pushes Chcolor () into the function call stack. After execution, it pops up in turn. (Return can terminate code execution directly, popup the function call stack for the current context)

Therefore, after the function is called, the execution context is generated.

After the execution context is generated, the execution context creates the variable object, establishes the scope chain, and determines the this point before the code begins execution.

The

Saves internal variables, inline functions, and establishes arguments objects to hold the current context parameters. construct its scope chain, the variable declared with Var in the search function is placed in the chain (it has been placed in the syntax tree during the parsing phase, At this time just copied over), When looking for a variable, it looks up along its own chain of scopes.

  If the function refers to the value of an external variable, the JavaScript engine creates a closure (closure) for the function, which is a completely closed and independent scope that will not be recycled by the JavaScript engine as garbage after the function call is complete. Closures can exist for a long time.

The code begins execution and the variable assignment function reference executes the subsequent code.

Pre-compilation and execution of JavaScript