足球小将GOLDEN23:解决循环中setTimeout执行顺序的问题

足球竞彩网 www.2ts2.com.cn  更新时间:2018年06月20日 14:15:58   作者:筱葭   我要评论

今天小编就为大家分享一篇解决循环中setTimeout执行顺序的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

期望:开始输出一个0,然后每隔一秒依次输出1,2,3,4。

for (var i = 0; i < 5; i++) { 
 setTimeout(function() { 
  console.log(i); 
 }, 1000 * i); 
} 

结果:输出5。

原因:setTimeout 使函数延迟1s执行,而for循环执行完成还不到0.1秒,到执行函数的时候,其实 i 已经变成5了,因此console.log(i)输出5。

解决方法一:使用let块作用域。

for (let i = 0; i < 5; i++) { 
  setTimeout(function() { 
   console.log(i); 
 }, 1000 * i); 
} 

解决方法二:加个闭包。

for (var i = 0; i < 5; i++) { 
 (function(i) { 
  setTimeout(function() { 
   console.log(i); 
  }, 1000 * i); 
 })(i); 
} 

结果:开始输出一个0,然后每隔一秒依次输出1,2,3,4。

失败方法:

for (var i = 0; i < 5; i++) { 
 (function() { 
  setTimeout(function() { 
   console.log(i); 
  }, 1000 * i); 
 })(); 
} 

结果:输出 5。

原因:去掉函数的参数i,则函数内部没有对i保持引用。

解决方法三:

for (var i = 0; i < 5; i++) { 
 setTimeout((function(i) { 
  console.log(i); 
 })(i), i * 1000); 
} 

结果:立马输出0-4。

原因:setTimeout可以接受函数或者字符串作为参数,而给setTimeout传递了一个立即执行函数,该立即执行函数是undefined ,也就是说等价于setTimeout(undefined, ...)。立即执行函数会立即执行。

以上这篇解决循环中setTimeout执行顺序的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

最新评论

  • 浙江大学杭州国际城市学研究中心博士后研究基地2018年上半年招聘启事 2019-04-20
  • 引爆全联盟!勇士老板宣布球队计划 完全不给活路 2019-04-16
  • 特金会:无非就是“一大”和“一多”!—吴建勋的博客—强国博客—人民网 2019-04-13
  • 贵州瓮安:荒坡变花海 美景引客来 2019-04-12
  • 国家审计促发展 促改革 促安全 促绩效系列访谈 2019-04-12
  • 中国是亚洲和平的基石 2019-04-05
  • 足球运动也是需要不断创新的,不能老是跟着别人的套路走!同样需要较高的综合素质,不能从小就走上专业化的道路。不然就只能是四肢发达头脑简单,就会陷入机械足球的泥潭! 2019-04-05
  • 你这帖子怎么像四两为你代笔的?[微笑] 2019-04-02
  • 郑板桥的“六分半书” 2019-04-02
  • 重庆私藏的绝美古镇 悠闲不打挤 2019-04-01
  • 香江直通车之专访香港义工联盟常务副主席马浩文 2019-03-31
  • 云南大学:努力开创边疆民族地区建设一流大学之路 2019-03-26
  • 女性之声——全国妇联 2019-03-19
  • 全国省级新税务机构统一挂牌 2019-03-05
  • 一根充电线从天而降 楼下玛莎拉蒂被砸出两个凹陷 2019-03-01
  • 431| 962| 437| 766| 379| 721| 641| 680| 528| 117|