What is JavaScript hoisting?

JavaScript is an easily misunderstood language, but its strength is beyond doubt. Personally, if you want to understand the JavaScript language in depth, you must first understand its basic concepts (e.g. scope,closure,hoisting, etc.). Today, I would like to make a description of JavaScript hoisting (domestic translation as a variable promotion) by your own understanding:

Before explaining JavaScript hoisting, take a look at a few pieces of code:

1     //Code Snippet 1--------------------------2     varMyVar = ' variable value '; 3Console.log (MyVar);//Variable Value4     //Code Snippet 2--------------------------5     varMyVar = ' variable value '; 6(function() { 7Console.log (MyVar);//Variable Value8     })();9     //Code Snippet 3----------------------------Ten     varMyVar = ' variable value ';  One(function() {  AConsole.log (MyVar);//undefined -       varMyVar = ' intrinsic variable value ';  -})();

Code Snippet 1 will print out the variable value in the console, it is easy to understand, code Snippet 2 will also print out the value of the variable in the console, the JavaScript compiler first in the anonymous function internal scope (scope) to see if the variable myvar is declared, found no, Continue to the up-level scope (scope) to see if MyVar is declared and found to be present, that is, the MyVar value of the scope is printed out. But code snippet 3 only makes a fine-tuning of code Snippet 2, and the result is output undefine!!!

　　Before you understand code snippet 3, you must first understand the concept of JavaScript hoisting. JavaScript hoisting: in JavaScript, every variable declaration is hoistedto the top of its declaration context. My understanding is that in the JavaScript language, the declaration of a variable (note that it does not contain a variable initial In the context of the Declaration, that is, within the scope of the variable, regardless of where the variable is declared, it is promoted to the top of the scope, but the order of the variable initialization is constant.

The left and right code output structure is the same, the left side of the code snippet at JS execution, the actual execution order as shown on the right side of the code (JS compiler will be the variable declaration to promote processing ).

After understanding the concept of ascension, go back to the beginning of the understanding of code snippet 3, code snippet 3 and the code after being hositing as shown:

The output structure is undefined! can be understood as an internal variable myvar in the last line of the anonymous function to declare the variable and assign a value, but the JS interpreter will declare the variable (does not include the assignment) promotion (hositing) to the first line of the anonymous function (top), Because only the MyVar variable is declared, MyVar is not assigned when the Console.log (myvar) statement is executed, so the JS output is undefined.

If the variable declaration is not lifted (hositing) pinned, it should be reported as an error. As shown in the following:

Here's a quiz to see if you understand the concept of hositing:

1     // Test Code---------------------- 2     var myvar = ' variable value '3     (function4       //  ? 5       MyVar = ' intrinsic variable value '6     } ' ();

What value should the code snippet output?

The answer is the variable value.

What is JavaScript hoisting?