ES6 let,const和for循环块级作用域

迷南。 2023-06-11 09:28 71阅读 0赞

## let和var的区别 ##

var能够在同一个作用域中重复声明变量
    let不能够在同一个作用域中重复声明变量
    
    全局作用域中var声明的变量，会自动成为window对象的属性
    全局作用域中let声明的变量，不会自动成为window对象的属性
    
    变量提升
    	JavaScript 中，函数及变量的声明都将被提升到函数的最顶部。
    	JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。
    var 存在变量提升
    let 不存在变量提升
    	在该变量之前称为暂时性死区 ：TDZ（Template Dead Zone）
    	暂时性死区的本质是变量已经在当前作用域中，但是不能够使用
    
    var 关键词不能够让 { } 生成块级作用域
    let 关键词可以让 { } 生成块级作用域

//var的变量提升,先给b赋值，然后再声明变量b,不报错
    b = 10;
    console.log(b);
    var b;
    
    //let不存在变量提升,所以先赋值再声明变量的话会报错
    c = 5;
    console.log(c)
    let c;

解决for循环中i指向最终值的问题

for(var i=0; i<10; i++){ 
    	setTimeout(function(){ 
    		console.log(i);
    	},1000)
    }
    //因为setTimeout是异步函数，所以定时器并没有立即执行console.log(i)，而是等循环结束之后才执行
    //函数执行结果：10
    
    //解决方法：
    //1.利用一个立即执行函数
    for(var i=0;i<10;i++){ 
    	(function(i){ 
    		setTimeout(function){ 
    			console.log(i);
    		}}
    	)(i)
    }
    //执行结果：0,1,2,3,4,5,6,7,9
    
    //2.使用let
    for(let i=0;i<10;i++){ 
    	setTimeout(function(){ 
    		console.log(i);
    	},1000)
    }
    //执行结果：0,1,2,3,4,5,6,7,9

## for循环块级作用域 ##

在for循环中,不仅{}会生成块级作用域,()也会生成块级作用域
    ()块级作用域 是{}块级作用域的父级作用域

for(let i=0;i<5;i++){ 
      /* * i=0 0<5 回调函数 * i=1 1<5 回调函数 * i=2 2<5 回调函数 * i=3 3<5 回调函数 * i=4 4<5 回调函数 * i=5 5<5 * */
         setTimeout(function(){ 
             console.log(i);
         },1000);
     }
     console.log(i);//i is not defined
    
    //let 关键词可以让 { } 生成块级作用域
     let b = 2;
     { 
         let b = b;//Cannot access 'b' before initialization（无法在初始化之前访问'b'）
         console.log(b)
     }