碰到一道题:
for(var i=0;i<2;i++){
setTimeout(function(){
console.log(i);
},100)
} //输出结果为:2 2
for(let i=0;i<2;i++){ setTimeout(function(){ console.log(i); },100) } //输出结果为:0 1
我们先从第一个for循环说起,setTImeout是异步执行的
因此setTImeout在异步队列中,需要等待同步队列(for循环)执行完成后才可进行,
此时,同步队列执行完成后i为2,所以执行setTImeout时,输出为2
接着看第二个for循环,由于i使用let定义的,let为块级作用域,但按我们的正常理解,应该会得出上边的结果
找了下网上,解释如下:
for循环中的let,事实上将其重新绑定到每一个循环迭代中,在确保上一次循环迭代结束后才会进行下一步循环,重新赋值
简单说就是let的for循环中,每次都需要保证循环体里的执行完毕后才会进行下一次循环(我是这么理解的)
又找了一个相似的例子
var a = []; for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[6](); // 10
由于i是全局作用域,可被函数中的i获取得到,所以数组函数中输出的i均为10;
var a = []; for (let i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[6](); // 6
而这里的i是块级作用域,当前i只能在本轮循环中奇效,每次循环中的i均为一个新的变量,因此最终取出的值为6