Promise 串行调用面试题

最新看到一个比较有趣的面试题：

怎么串行执行 Promise ?

这里简单给大家介绍下解答。针对多个 Promise 方法，原生提供了

all

和

race

方法。但是，他们都不是串行执行。那应该如果执行串行方法？这里介绍两种写法：

递归执行

简单来说就是在 then 方法里面递归传递下一次异步方法：

then(next())

function iteratorPromise(arr){

	(function iter(){
		if(arr.length)
			arr.shift()().then(iter)
	})()
}

let arr = [()=>{
	return new Promise(res=>{
		console.log("run", Date.now());
		res()
	})
},()=>{
	return new Promise(res=>{
		console.log("run", Date.now());
		res()
	})
},()=>{
	return new Promise(res=>{
		console.log("run", Date.now());
		res()
	})
}]

iteratorPromise(arr);

// output
run 1529918098567
run 1529918098568
run 1529918098569
           

循环调用

这种办法比较取巧，直接利用 Promise.resolve()。通过循环赋值，得到最终的结果。

function iteratorPromise(arr){

	let res = Promise.resolve();

	arr.forEach(fn=>{
		res = res.then(()=>fn()) // 关键是 res=res.then... 这个逻辑
	})
}

let arr = [()=>{
	return new Promise(res=>{
		setTimeout(()=>{
			console.log("run", Date.now());
			res()
		},1000)
		
	})
},()=>{
	return new Promise(res=>{
		setTimeout(()=>{
			console.log("run", Date.now());
			res()
		},1000)
		
	})
},()=>{
	return new Promise(res=>{
		setTimeout(()=>{
			console.log("run", Date.now());
			res()
		},1000)
		
	})
}]

iteratorPromise(arr);


// output
run 1529918643573
run 1529918644574
run 1529918645580
           

原文发布时间为：2018年06月25日

原文作者：villainhr

本文来源： 

掘金 https://juejin.im/entry/5b3a29f95188256228041f46

如需转载请联系原作者