catch的用法

paramTest().then((number) => {
 console.log('resolved');
 console.log(number);
 console.log(data); //data为未定义
},(reason) => {
 console.log('rejected');
 console.log(reason);
}).catch((err) => {
 console.log(err);
})

catch 方法其实就是 .then(null, rejection) 的别名，也是用来处理失败失败的回调函数，但是还有一个作用：当 resolve 回调中如果出现错误了，不会堵塞，会执行 catch 中的回调。

all的用法

const p = Promise.all([p1, p2, p3]);

p.then(result => {
 console.log(result);
})

const p1 = new Promise((resolve, reject) => {
 setTimeout(() => {
 resolve('p1');
 }, 1000);
})
.then(result => result)
.catch(e => e);

const p2 = new Promise((resolve, reject) => {
 setTimeout(() => {
 resolve('p2');
 }, 3000);
})
.then(result => result)
.catch(e => e);

Promise.all([p1, p2])
.then(result => console.log(result))
.catch(e => console.log(e));
//3秒后

race的用法

const p = Promise.race([p1, p2, p3]);

p.then(result => {
 console.log(result);
})

以下是 race 的例子，和 all 方法对比，可以看到返回值有很明显的区别。

const p1 = new Promise((resolve, reject) => {
 setTimeout(() => {
 resolve('p1');
 }, 1000);
})
.then(result => result)
.catch(e => e);

const p2 = new Promise((resolve, reject) => {
 setTimeout(() => {
 resolve('p2');
 }, 3000);
})
.then(result => result)
.catch(e => e);

Promise.race([p1, p2])
.then(result => console.log(result))
.catch(e => console.log(e));
//1秒后

点击这里查看本文中实例源代码

resloader是基于Promise实现的一个图片预加载并展示加载进度的插件，猛戳这里了解详情。如果感觉还可以的话，欢迎star

相关推荐：

使用Promise简化回调

微信小程序Promise简化回调实例分享

jQuery的Promise如何正确使用