前阵子在工作上遇到一个需要做完两个异步请求后的数据,再进行数据处理的事情,因为都没有办法实现,最后在大神同学的帮助下,用Promise解决了,所以系统性地学习一下,并做一下学习笔记
1、Promise简介
因为javascript是单线程的,所以很多的事情只能够使用异步的方式去做好,而异步又会出现执行先后顺序,过去使用的是回调的方式来解决这样的问题。
后来出现了Promise的方法,各种各样的第三方库都实现了Promise方法,而到了ES6,官方把Promise制定了标准,官方进行了支持(道听途说的)
2、Promise的接口列表:
then 、catch、resolve、reject、all、race
在Promise调用的function中如果处理的结果为正常,则调用resolve函数,如果异常,则调用reject函数。
在function中调用resolve方法时,程序中就会调用then函数,如果调用reject方法时,就会调用catch函数。
参数传递方面需要保持一致就可以了,就像我们注册一个普通的函数一样。
Promise.all会接收一个promise对象数组,等待数组中的promise函数全部执行完成后,才会执行all的.then或者.catch方法。
Promise.race会接收一个promise对象数组,只要数组中有一个promise函数执行完成后,就会执行race的.then或者.catch方法。
3、上代码
// `delay`毫秒后执行resolve
function timerPromisefy(delay) {
return new Promise(function (resolve) {
setTimeout(function () {
resolve(delay);
}, delay);
});
}
var startDate = Date.now();
// 所有promise变为resolve后程序退出
Promise.all([
timerPromisefy(1),
timerPromisefy(32),
timerPromisefy(64),
timerPromisefy(128)
]).then(function (values) {
console.log(Date.now() - startDate + 'ms');
// 約128ms
console.log(values); // [1,32,64,128]
});
// 任何一个promise变为resolve或reject 的话程序就停止运行
Promise.race([
timerPromisefy(1),
timerPromisefy(32),
timerPromisefy(64),
timerPromisefy(128)
]).then(function (value) {
console.log(value); // => 1
});
执行结果:
4、参考资料: