A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© zhoujiaxu 初级黑马   /  2019-4-25 12:44  /  1270 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文










原for(let i = 0; i < 10; i++)和for(var i = 0; i < 10; i++)的思考

2017年08月21日 11:02:26 chenqiwen2017 阅读数:3638




let、 var、 setTimeout,一点思考。


for(var i = 0; i < 10; i++){
setTimeout(function(){
console.log(i);
},100);
}
1
2
3
4
5

结果是很显而易见的,10次都是10,在面试前端的闭包知识时候很常见。
用上let之后,


for(let i = 0; i < 10; i++){
setTimeout(function(){
console.log(i);
},100);
}
1
2
3
4
5

结果是:
0、1、2、3、4、5、6、7、8、9
为什么var和let声明的i,得到不同的结果?
var声明的i,作用域不仅仅在for循环内,还在for循环的外部。
当setTimeout执行的时候,for循环已经完成,i此时的值是10,我们稍微调整一下代码:


for(var i = 0; i < 10; i++){
setTimeout(function(){
consoleLog();
},100);
}
function consoleLog(){
console.log(i);
}
1
2
3
4
5
6
7
8
结果是10次10。

for(var i = 0; i < 10; i++)
1



var i;
for(i = 0; i < 10; i++)
1
2
等价。
但是在let声明的时候则不一样,

for(let i = 0; i < 10; i++)
1



let i;
for(i = 0; i < 10; i++)
1
2

是不等价的,因为let声明只在代码块中有效。
但是,如果仅仅这样,我们或许很容易理解


for(var i = 0; i < 10; i++){
setTimeout(function(){
console.log(i);
},100);
}
1
2
3
4
5
得到10次10,然而为什么


for(let i = 0; i < 10; i++){
setTimeout(function(){
console.log(i);
},100);
}
1
2
3
4
5
得到0-9?

在setTimeout的时候,匿名函数function(){console.log(i);}会被声明创建,当匿名函数执行的时候,会查找当前运行环境的 i 的值。
var声明的 i ,运行环境的 i 的值为10,但是let声明的 i,运行环境中 i 的值是每一个循环创建匿名函数时候的 i。
所以得到了0-9的值。
let替换var,可以很好的解决闭包的问题。

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马