js之let和var在for循环中的区别

先说一点let的块作用域： 只要是大括号 { }中有let，就形成块级作用域，不管是在函数中还是在if中。例如

function fn(){
          
   
	let a = 22
	if(true){
          
   
		let a = 33		
	}
	console.log(a);
}

fn() // 22

为什么输出的是22 而不是33 因为只要let在大括号里，就形成块级作用域，只能在其本身（大括号内）块级作用域中访问。 在例如：

function fn(){
          
   
	let a = 22
	if(true){
          
   
		let b = 33		
	}
	console.log(a);// 22
	console.log(b); // 报错：b is not defined
}

fn()

let 与大括号形成的块级作用域，只能在其大括号中使用，所以b不能被外面访问。

let arr = [1,2,3,4]
for (var i = 0; i < arr.length; i++) {
          
   
	setTimeout(()=>{
          
   
		console.log(i);
	},100)
}

以上输出四个4是因为 var 没有块级作用域的概念，而for又是同步函数，setTimeout是异步函数。 js中先执行 完同步函数，才能执行异步函数，所以 i 先执行完，在执行异步setTimeout.

let arr = [1,2,3,4]
for (let i = 0; i < arr.length; i++) {
          
   
	setTimeout(()=>{
          
   
		console.log(i);
	},100)
}

输出： 0 1 2 3 为什么此时的 i 不是4了呢？ 因为let具有块级作用域的概念，执行的时候是将最外层大括号里的整块执行完毕，才执行下一次循环。