Foreword
js in the presence of variable lift front-end er basically all know, but what is this variable lift, enhance what stage of the variable var, let and function keywords such declaration has been raised whether the conditions in the if statement, whether lifting can penetrate implementation of body condition statement? I do not know how many people have a deep understanding of these.
First on the code:
var b = true;
if(b) {
function a() {
console.log('a');
}
} else {
function a() {
console.log('b');
}
}
a();
复制代码When you read this code, if they have no accurate determination and know how it is run, then you herein may be helpful to you.
js pretreatment
JS before the execution, the code will be pretreated pretreatment process will deal var advance, function declarations, class, const, let declaration and other key variables.
Disclaimer promotion rules
There are some details we may not normally be noted in the statement lift variables, there will be a statement of the specific acts to enhance summarized into three categories, namely:
- var statement
- function declarations
- class, let and declare const
var statement
When the variable declaration var upgrade, just in the current scope declare and initialize the variable whose value is undefined. Look at a practical example:
function s() {
console.log(a);
var a = 'ss';
}
s();
复制代码The result of this code is printed is undefined, since the scope var a pretreatment is lifted to the beginning of the function s and initialization is undefined, and the printed result is undefined.
Let's look at another section
function test() {
console.log(a);
if(false) {
var a = 'ss';
}
}
test();
复制代码Print result of this code is undefined, although judging condition is false statement will never be executed, but the var statement regardless of the upgrade is that it can enhance the penetration of conditional statements directly to the top of the current scope, as to enforcement to enhance the implementation of the statement is not regardless.
Var on a short lift, to the top of the current scope, and initializes its value undefined.
function declarations
Var improvement compared to the simple, function of the complex will have to upgrade, consider the following code:
function test() {
console.log(a);
function a() {
}
}
test();
复制代码This code is relatively simple, the function will print out a function of a, rather than undefined, that is to say not only enhance the function declarations variable declarations, as well as the assignment to a variable. It is not whenever, upgrade and enhance function declarations are variable declaration also assign it? Consider the following code:
function test() {
console.log('函数a', a);
if(false) {
function a() {
}
}
}
test();
复制代码Print result of this code is undefined, if there is no function declaration, direct printing a, here will throw the error not defined.
This shows that in an if statement function declaration name will still increase, but is assigned the value undefined, and code execution phase of the specific assignment occurred in the.
class, let and declare const
class, let's declare const and upgrade with the same characteristics, so I will just say the following let.
Consider the following piece of code is:
function test() {
console.log(a);
let a = 'aLet';
}
test();
复制代码Ah, this code will throw wrong, like this
Now go online to search about the contents of the variables on let's ascension will still see a lot of say let variable declaration to enhance the argument does not exist, the reason given is that since the upgrade, why use the variable before it is declared it will complain? Here to talk about why the thought let exist for improvement. Consider the following codes:
function test() {
console.log(c)
var c = 'tVar';
let c = 'cLet';
};
test();
复制代码This code will throw at mistake, tell your variables with the same name already exists, and can not define c, it stands to reason that it should be the result of normal print undefined fishes, after all, declared var c c will increase and the assignment is undefined. If you remove the definition of let c, as we expect it will print undefined, that is to say let statements appear in the back of the impact of the results of the previous statement.
This shows that let variable declaration will still be processed in the preprocessing stage, but this treatment is simply a statement of scope to enhance the declaration of variables, but did not give variable initialization, but before the variables are initialized can not be used , also appeared before the let statement using the variable throws an error.
Statement on let's upgrade there is a term called temporary dead zone, in fact very good understanding of the word, let the variable declaration before it is assigned is not available, then the variable is assigned to the variable before the beginning of where the scope of that range segment location called dead zone of this variable, but the scope of this variable will not be affected, when it is assigned, even calling this variable before it is defined the position would still be possible, this is not available it is temporary, so called temporary dead zone. Being discussed here is not much sense dead zone, know how it is on the line.
Statement upgrade priority
Statement elevate the priority occur in the case of variable declaration of the same name in the same scope, so let, const, class variables declared there is no need to discuss this issue. Just consider the variables var and function declarations.
For var statement with the same name, Javascript is used to ignore the principle, the statement will be ignored, variable declaration and assignment operator can write together, but only a statement would be promoted, after lifting the default value of the variable is undefined, the result is the assignment variable value before execution of the operation will be undefined
For the function declaration of the same name, Javascrip t is used to cover the principles, the first statement will be covered, because the function assigns a function at the time of the statement, so the end result of a series of the same scope function declaration is a function of the same name when calling The last time the same content and function declarations, consider the following code:
function test() {
a();
function a() {
console.log('a1')
}
function a() {
console.log('a2')
}
}
test();
复制代码The printed result is a2, the function definition described later covers the front of the function.
For function declarations and variable declarations of the same name, using the principle is ignored, since the lift will enhance the function declaration before the variable declarations, variable declarations will be ignored, so the result is a valid function declaration. Consider the following codes:
function test1() {
console.log(typeof a);
var a = 'aVar';
function a() {
}
}
test1();
//先声明函数后声明变量，证明上边的例子不是function覆盖了变量
function test2() {
console.log(typeof a);
function a() {
}
var a = 'aVar';
}
test2()
复制代码The results test1 and test2 are running function, which indicates that variable declarations function is a priority.
Integrated the above description, function declaration to enhance priority is higher than the variable declaration var promotion.
in conclusion
Although this article is to discuss the variables increase, but I personally do not advocate the use of this practice violates human intuition variables before using the variable declaration before the variable declaration, after using it in the actual coding we should first declare variables. Variable lift control will help us to better understand the code, avoid can not understand in the face of elevated usage.
Reproduced in: https: //juejin.im/post/5c6d78696fb9a049e308b029