Understanding variable declaration hoisting

· Variable declaration hoisting

--let const

function aa() {
    console.log(x)   
    let x = '2';
};
aa();
Variable cannot be used before initialization

At this point, can it be proven that let is hoisted without variable declarations ? NO NO NO ~

see next example

function aa() {
    console.log(x)
    var x = '1'  
    let x = '2';
};
aa();
At this time, the console reports an error, and X has been declared. At this time, it can be proved that there is a variable declaration promotion in let.

· Regarding the declaration of function, the first declaration will be overwritten

function test() {
    a();
    function a() {
        console.log('1')
    }
    function a() {
        console.log('2')
    }
 }
 test();
//2

For function declarations and variable declarations with the same name, the principle of ignoring is adopted. Since the function declaration will be promoted before the variable declaration during promotion, the variable declaration will be ignored, so the result is that the function declaration is valid.

function test1() {
    console.log(typeof a);>>function //Declaration phase: functional declaration ignores literal declaration
    var a = '111';
    function a() {
        console.log(11)
    }
  console.log(typeof a);>>string //call phase: functional declaration is promoted, then overwritten by literal declaration
}
test1();  




//declare the function first and then declare the variable, which proves that the above example is not the function that overwrites the variable
function test2() {
    console.log(typeof a);
    function a() {
        
    }
    var a = '111';
}
test2 ()


// funct

Function declarations take precedence over function expressions

var getName = function() {
  console.log(1)
}
function getName() {
  console.log(2)
}
getName()
//1
Functions are declared first and then overridden by function expressions

 

· Function declaration declaration, immediately available

console.log(getName())
function getName() {
  console.log(2)
}
//>>2


Function expression is not available
console.log(getName())
var getName=function(){
  console.log(2)
}
//>>getName is not a function

·Declaration of the same name, functional declaration VS literal declaration variable---function VS variable

   console.log(getname)//>>>function declaration phase: function declaration ignores variables declared in literals
        var getname='john'
        function getname(){
            console.log('mary')
        }


console.log(getname())>>>john //calling phase: function declaration takes precedence and is then overwritten by literal declaration

Declaration of the same name, functional declaration function VS function expression --- function VS function

     console.log(getname())>>>mary //Declaration phase: function declarations ignore function expressions
        var getname=function(){
            console.log('john')
        }
        function getname(){
            console.log('mary')
        }
 console.log(getname())>>john //calling phase: functional declaration takes precedence, followed by function expression

·Variable VS function VS function expression >> The declaration stage function will ignore other >> the call stage function expression will be assigned and overwritten

test();>>//’函数‘---函数可以直接调用，而调用阶段，同名函数会忽略其他声明
console.log(test); //  function test(){console.log("函数"); }声明阶段, 同名函数会忽略其他声明
function test() {
    console.log("函数");  
}
console.log(test);  //  function test(){console.log("函数"); } //声明阶段,同名函数会忽略其他声明
var test = "变量";
console.log(test);  //"变量"  此时test已经被赋值
var test = function(params) {
    console.log("函数表达式");
};
console.log(test);    //"函数表达式"，此时test已经被函数表达式覆盖
test();               //调用阶段，函数表达式以执行顺序排到最后，覆盖之前的所有
 

 

//Writing at the end, it can be concluded how to create variables and function expressions. As long as the execution order is above, they can be regarded as the declaration stage. The principle of ignoring variables by functions is adopted, and those after variables are executed in the order of execution.

{{o.name}}

{{m.name}}