js函数和变量的声明提升问题

Posted 2022-12-07 iiiLISA

精进成长的本质是消除模糊。
推荐：
推荐阅读博客

var和函数的声明会被提升（赋值不会提升！）；
函数声明先提升，变量声明后提升。

		var a='apple';
        function fighting()
            console.log(a);//undefined
            var a='angel';
            console.log(ss());//angel
            function ss()
                return a;
            
        
        fighting();

相当于

        function fighting()
            function ss()//函数声明被提升
                return a;
            
            var a;//变量声明被提升
            console.log(a);//undefined
            a='angel';//赋值未被提升
            console.log(ss());//angel
        
        fighting();

例题：

		var b='boy';
        console.log(b);//boy
        function fighting()         
            console.log(a);//undefined
            console.log(c);//undefined
            if(a==='apple')
                a='Alice';
            else
                a='Ada';
            
            console.log(a);//Ada
            var a='Andy';
            middle();
            function middle()
                console.log(c++);//NaN
                var c=100;
                console.log(++c);//101
                small();
                function small()
                    console.log(a);//Andy
                
            
            var c=a=88;
            function bottom()
                console.log(this.b);//boy，window对象
                b='baby';
                console.log(b);//baby
            
            bottom();
        
        fighting();
        console.log(b);//baby，函数bottom中的b未加var声明，会覆盖全局变量的b

函数声明提升问题

例一：

fn(); // 输出 undefined

function fn() 
    console.log(a);
    var a = 1;

相当于

function fn() 
	var a;
    console.log(a);
    a = 1;

fn(); // 输出 undefined

例二：

fn(); // 报错，只提升了 var fn;  不能对 undefined 进行函数调用

var fn = function() 
    console.log("fn");

相当于

var fn;
fn();
fn=function() 
    console.log("fn");

例三：

		fn(); // 1
        var fn;

        function fn() 
            console.log(1);
        

        fn = function() 
            console.log(2);
        
        fn(); // 2

相当于

		function fn() //首先提升函数
            console.log(1);
        
        //var fn;//与函数同名会被覆盖
        fn();//1
        fn = function() 
            console.log(2);
        
        fn();//2

尽管与函数同名的var声明会被覆盖，但是，同名的函数后面会覆盖前面的。

fn(); // 3
function fn() 
    console.log(1);


var fn = function() 
    console.log(2);


function fn() 
    console.log(3);

暂时性死区

let，const没有变量提升现象。会禁止在声明前使用变量。

ES6 明确规定，代码块（）中如果出现 let 和 const 声明的变量，这些变量的作用域会被限制在代码块内，也就是块级作用域。

		var a = 1;
        if(true)
            // 死区开始--------------------------
            // 访问 a 都会报错，不能在声明之前使用
            a = 2;
            console.log(a);
            // 死区结束--------------------------
            let a;
            console.log(a); // undefined
            
            a = 3;
            console.log(a); // 3
        
        console.log(a);//1，不会影响块作用域之外的a的值