工作中需要写一个延时弹窗,想到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); }
留作下次参考。
原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/98542.html