What is variable promotion in js? Why is there variable promotion?

What is variable promotion in JavaScript? This article will take you through variable promotion in js and introduce why there is variable promotion.

js variable promotion

JavaScript is a single-threaded language, so execution must be in order. But it is not analyzed and executed line by line, but analyzed and executed piece by piece. The compilation phase will be performed first and then the execution phase. During the compilation phase, a few milliseconds before the code is actually executed, all variable and function declarations are detected and added to memory within a JavaScript data structure called Lexical Environment. So these variables and functions can be used before they are actually declared.

Let’s start with a simple example:

 a = 2;
 var a;
 console.log(a);

What will the above code output? If this code is executed from top to bottom, it will definitely output undefined, but JavaScript is not A language that executes top-down. The output of this code is 2, is it unexpected? So, why is this happening? The key point lies in--Variable promotion. It will raise the declarations of all variables in the current scope to the top of the program. Therefore, the above code is equivalent to the following code. Does this make it clearer?

 var a;
 a = 2;
 console.log(a);

Then let’s look at another example:

 console.log(a);
 var a = 2;

What will this code output? Output 2? In fact, this code will output undefined. This is why? As I just said, JavaScript will promote the declaration of variables to the top, but the assignment statement will not be promoted. For js, var a = 2 is divided into two-step parsing:

var a;
a = 2;

And js will only promote the sentence var a, so the statement just now is equivalent to:

 var a;
 console.log(a);
 a = 2;

So, why is there variable promotion?

Why does the phenomenon of variable promotion occur? Because js, like other languages, has to go through the compilation and execution stages. When js is in the compilation stage, it will collect all variable declarations and declare variables in advance, and other statements will not change their order. Therefore, during the compilation stage, the first step has been executed, and the second The part is executed only when the statement is executed in the execution phase.

Variable declaration

The variable declaration of js can be roughly divided into three types: var declaration, let and const declaration and function declaration. When function declarations appear together with other declarations, some conflicts may occur. Let’s look down:

 fn();
 function fn () {
     console.log('fn');
 }
 var fn = 2;

What do you think it will output? Will I get an error if I write this? In fact, the output result is fn. This explains the question we just asked, when a function declaration appears together with other declarations, who takes precedence? The answer is, Function declaration is above all else, after all, functions are the aristocratic class of js.

What to do with so many function declarations?

 fn();
 function fn () {
     console.log('1');
 }
 function fn () {
     console.log('2');
 }

The output result of the above code is 2. This is because when has multiple function declarations, the last function declaration replaces the previous .

There is one last example:

 fn();
 var fn = function () {
 console.log('fn');
 }

After the above understanding, will this be very simple? This is the same as the second example. This format of var fn = function() {} is called a function expression. It is actually divided into two parts:

var fn;
fn = function() {};

Referring to Example 2, we can know that the result of this should be an error (because fn is declared but not assigned, so fn is undefined).

Summary

So, let’s summarize.

• js will elevate the declaration of the variable to the top of js for execution. For statements such as var a = 2, it will be split and the var a step will be promoted.

• The essence of variable promotion is that the js engine declares all variables when compiling, so when executing, all variables have been declared.

• When there are multiple variables with the same name, the function declaration will overwrite other declarations. If there are multiple function declarations, the last function declaration overrides all previous declarations.

For more programming-related knowledge, please visit: Introduction to Programming! !

The above is the detailed content of What is variable promotion in js? Why is there variable promotion?. For more information, please follow other related articles on the PHP Chinese website!