for 循环中的setTimeout(function(){})异步问题,为什么改var 为let就可以解决?

1 for (var i=1; i<=9; i++) {
2     setTimeout( function timer(){
3     console.log( i );
4     },1000 );
5 }

上面的代码,由于setTimeout是异步的,那么在真正的1000ms结束前,其实10次循环都已经结束了
为什么改成let这样就可以解决?

1 for (let i=1; i<=9; i++) {
2     setTimeout( function timer(){
3         console.log( i );
4     }, 1000 );
5 }

还有另外一种方法,改成

1 for (var i=1; i<=9; i++) {
2     (function(j){
3         setTimeout( function timer(){
4             console.log( j );
5         }, 1000 );
6     })( i );
7 }

我觉得这种方法也是在timer()之外传入了参数i,跟一开始那个错误的代码并没有什么区别啊,为什么多加一层匿名函数就可以解决异步问题?

阅读 8.5k
3 个回答

这两种方法都不是解决异步问题的,而是解决变量作用域的问题的。

因为函数 timer() 属于一个新的域,通过 var 定义的变量是无法传入到这个函数执行域中的,于是有了你展示的两种解决办法,第一种是通过使用 let 来声明块变量,这时候变量就能作用于这个块,所以 timer 就能使用 i 这个变量了。第二种是通过传入参数,间接的把变量传入到 timer 中。

在闭包中,变量是沿着作用域链进行访问的,这样就只能访问变量的最终值。而利用函数参数传值就可以达到预期的要求。多看看 闭包 作用域链的相关知识点就明白了。javascript 高级程序设计一书对这点讲解的特别详细。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏