for循环中的setTimeout()

自作多情 提交于 2019-12-29 13:20:58
for(var i = 0;i<3;i++){
    setTimeout(function(){
         console.log(i)  
    },1000)  
};

打印结果:三个3

原因分析:setTimeout()是一个异步处理函数,它会等待所有的主线程任务处理完,才开始执行自己的内部的任务,每隔1s往任务队列中添加一个任务【闭包函数,setTimeout()中的函数,现在还没执行】,当主线程执行完时,这时i=3,

才开始执行任务队列中的任务【闭包函数,setTimeout()中的函数开始执行,执行三次】。

for循环是遵循js执行机制--从上到下,依次同步执行,for循环括号内的就是主线程,执行完时i是3,所以会打印出3次3;

如果想打印出0,1,2

解决方案:

  1. 把var改为let,let是块极作用域,每次for循环都会把对应的i绑定到添加的任务【闭包函数,setTimeout()中的函数】中,所以当主线程执行完时,也不会影响到每个任务中i。所以可以打印出0   1   2
  2. 把定时器放在一个自执行函数中用i当做参数
    (function(i){
          setTimeout(function(){
                console.log(i);
           },1000)
    })(i)
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!