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具有块级作用域的概念,执行的时候是将最外层大括号里的整块执行完毕,才执行下一次循环。
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_31676483/article/details/127307180
今日推荐