话不多说,直接上代码
for(var i=0;i<5;i++){
setTimeout(function(){
console.log(i)
},1000)
}
1s后输出5个5。var 声明的变量,每次循环后的新值,会替换掉上一次的值;
那么好了,问题来了。如何输出我们想要的0—>1—>2—>3—>4
- ES5 改写
-
闭包,但是这种写法是1s后一次性输出0,1,2,3,4。并非我们要求的一秒一个,一秒一个。for (var i = 0;i<5;i++) { (function(j){ setTimeout(function(){ console.log(j) },1000); })(i) }
ps:可以将时间间隔写成 time*j
-
- let 声明变量
也是一次性输出。改写方式同上,时间间隔上做处理for (let i = 0;i<5;i++) { setTimeout(function(){ console.log(i) },1000)
- Promise 改写
将 var 换成 let 声明方式,就可以去掉外层的(j)(i)这个了let arr=[]; for (var i = 0;i<5;i++) { ((j)=>{ let p = new Promise(function(resolve,reject){ setTimeout(function(){ console.log(j); resolve(); },1000*j) }) arr.push(p) })(i) }; Promise.all(arr)
- async/awit 改写
function timeout(ms) { return new Promise((resolve) => { setTimeout(resolve, ms); }); } async function asyncPrint(value, ms) { await timeout(ms); console.log(value); } for (let i=0;i<5;i++) { // let 声明 asyncPrint(i,1000*i) } for (var i= 0;i<5;i++) { //var 声明 ((j)=>{ asyncPrint(j,1000*j) })(i) }