一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

js for里面setTimeout问题

时间:2016-06-13 编辑:简简单单 来源:一聚教程网

工作中需要写一个延时弹窗,想到for里面setTimeout,结果发现并没有按照要求走,没有延时。

于是就写个简单的测试:

for(var k=1;k<=9;k++) {
    setTimeout(aa(k),1000);
    console.log(k);
}
 
function aa(k) {
    console.log('k:'+k);
}

发现压根就没有等待,网上说setTimeout是异步的。也就是说for都执行完了,setTimeout还在执行。但这里表现的是setTimeout里的方法执行了,但是没有延时。
改成setTimeout(aa(k),1000*k);还是存在这样的问题。

1、通过setInterval()来模拟:

var d = 1;
var timer = setInterval(function() {
    console.log(d);
    d++;
 
    if(d>9) clearInterval(timer);
},1000);

2、闭包来实现:

for (var j=1; j<=9; j++) {
    (function(j){
        setTimeout( function timer(){
            console.log( j );
        }, 1000 *j);
    })( j );
}

3、定义块变量来实现:

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

留作下次参考。

热门栏目