for循环包裹setTimeout计时器
返回本版】  【发表帖子】  【回复帖子 浏览量  950      回帖数 0
lanlan123    等级  

楼主 发表于  2019/7/22 13:30:45    编 辑   

for(var i = 0; i < 5; i++) {
console.log(i)
}

这样for循环可打印出 0 - 4的结果

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

但这样只能间隔一秒打印出5个5

原因在于 setTimeout是异步,等for循环全部完成 i 后才会执行

解决方法可以将 for循环中的var 变成 let

let只作用于for循环内,这样每次付给setTimeout的值都是当前值

或者在setTimeout外再包一层function

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

}

将 i 作为参数传到setTimeout中运行 这样就可以得到每隔1秒加1的log结果了
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、网站建设 、平面设计服务。
1
表情
所有内容均为会员自愿发表,并不代表本站立场.