Promise、Promise.all、Promise.race的用法

Promise 是解决异步问题的统一方案，Promise的用途有：规范回调的名字和顺序；避免回调地狱，使代码可读性更强；方便捕获错误。

创建一个 Promise

function fn() {
  return new Promise((resolve, reject) => {
    resolve(result) //成功时调用 resolve
    reject(error)   //失败时调用 reject
  })
}

fn().then(success, fail).then(success2, fail2).catch(fail3)

使用 Promise.all

Promise.all 需要传入一个数组，数组中的元素都是 Promise 对象。
当这些对象都执行成功时，则 all 对应的 promise 也成功，且执行 then 中的成功回调。
如果有一个失败了，则 all 对应的 promise 失败，且失败时只能获得第一个失败 Promise 的数据。

const p1 = new Promise((resolve, reject) => {
  resolve('成功了')
})
const p2 = Promise.resolve('success')
const p3 = Promise.reject('失败')

Promise.all([p1, p2]).then((result) => {
  console.log(result)  //["成功了", "success"]
}).catch((error) => {
  //未被调用
})

Promise.all([p1, p3, p2]).then((result) => {
  //未被调用
}).catch((error) => {
  console.log(error)  //"失败"
});

使用 Promise.race

Promise.race() 里面哪个 Promise 对象最快得到结果，就返回那个结果，不管结果本身是成功状态还是失败状态。

const p1 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 500, "one");
});
const p2 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 100, "two");
});
Promise.race([p1, p2]).then((result) => {
  console.log(result); // "two"
  // 两个都完成，但 p2 更快
});

const p3 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 100, "three");
});
const p4 = new Promise(function(resolve, reject) {
  setTimeout(reject, 500, "four");
});
Promise.race([p3, p4]).then((result) => {
  console.log(result); // "three"
  // p3 更快，所以它完成了
}, (error) => {
  // 未被调用
});

const p5 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 500, "five");
});
const p6 = new Promise(function(resolve, reject) {
    setTimeout(reject, 100, "six");
});
Promise.race([p5, p6]).then((result) => {
  // 未被调用
}, error => {
  console.log(error); // "six"
  // p6 更快，所以它失败了
});