欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Promise案例解析

程序员文章站 2022-04-15 20:53:36
话不多说,直接上代码 for(var i=0;i<5;i++){ settimeout(function(){ console.log(i) },1000)...

话不多说,直接上代码

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

1s后输出5个5。var 声明的变量,每次循环后的新值,会替换掉上一次的值;

那么好了,问题来了。如何输出我们想要的0—>1—>2—>3—>4

es5 改写
for (var i = 0;i<5;i++) {
	(function(j){
		settimeout(function(){
				console.log(j)
		},1000);
	})(i)
}
闭包,但是这种写法是1s后一次性输出0,1,2,3,4。并非我们要求的一秒一个,一秒一个。
ps:可以将时间间隔写成 time*j let 声明变量
for (let i = 0;i<5;i++) {
	settimeout(function(){
		console.log(i)
	},1000)
也是一次性输出。改写方式同上,时间间隔上做处理
promise 改写
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)
将 var 换成 let 声明方式,就可以去掉外层的(j)(i)这个了
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)
}