异步JavaScript速查表

Promise基础知识

Promise 在初始状态下是未完成状态，既不是已完成也不是已拒绝。
当操作完成时，Promise将变为已完成状态，并带有一个值。
如果操作失败，Promise将被拒绝并带有一个错误。

创建Promise

传递给Promise构造函数的函数将同步执行。
使用resolve()或reject()来从值创建Promise。
Promise.resolve(val)将用val来完成Promise。
Promise.reject(err)将用err来拒绝Promise。
如果将一个已完成的Promise放入另一个已完成的Promise中，它们将合并为一个。

// 使用值来完成Promise，使用错误来拒绝Promise
new Promise((resolve, reject) => {
  performOperation((err, val) => {
    if (err) reject(err);
    else resolve(val);
  });
});

// 使用无值来完成Promise，不需要拒绝
const delay = (ms) => new Promise(resolve => setTimeout(resolve, ms));

处理Promise

Promise.prototype.then()接受两个可选参数（onFulfilled，onRejected）。
当Promise被完成时，Promise.prototype.then()将调用onFulfilled。
如果Promise被拒绝，Promise.prototype.then()将调用onRejected。
如果onRejected未定义，Promise.prototype.then()将传递错误。
Promise.prototype.catch()接受一个参数（onRejected）。
当省略onFulfilled时，Promise.prototype.catch()的行为类似于Promise.prototype.then()。
Promise.prototype.catch()将已完成的值传递。
Promise.prototype.finally() 接受一个参数 (onFinally)。
Promise.prototype.finally() 一旦有任何结果可用，就会调用 onFinally，并且不带任何参数。
Promise.prototype.finally() 会传递输入的 promise。

promisedOperation()
  .then(
    val => value + 1,   // 在 promise 被履行时调用
    err => {            // 在 promise 被拒绝时调用
      if (err === someKnownErr) return defaultVal;
      else throw err;
    }
  )
  .catch(
    err => console.log(err); // 在 promise 被拒绝时调用
  )
  .finally(
    () => console.log('Done'); // 一旦有任何结果可用，就会调用
  );

以上三个方法至少要等到下一个 tick 才会执行，即使对于已经有结果的 promise 也是如此。

合并 promises

Promise.all() 将一个 promise 数组转换为一个 promise 数组。
如果有任何 promise 被拒绝，错误将会传递。
Promise.race() 传递第一个已完成的 promise。

Promise
  .all([ p1, p2, p3 ])
  .then(([ v1, v2, v3 ]) => {
    // 值始终与 promises 的顺序对应，而不是它们解决的顺序（即 v1 对应 p1）
  });

Promise
  .race([ p1, p2, p3 ])
  .then(val => {
    // val 将取第一个已解决的 promise 的值
  });

async/await

调用一个 async 函数总是返回一个 promise。
(async () => value)() 将解决为 value。
(async () => throw err)() 将拒绝并抛出错误。
await 等待一个 promise 被履行并返回其值。
await 只能在 async 函数中使用。
await 也接受非 promise 值。
await 总是至少等到下一个 tick 才会解决，即使等待已经被履行的 promises 或非 promise 值也是如此。

async () => {
  try {
    let val = await promisedValue();
    // 在这里做一些事情
  } catch (err) {
    // 处理错误
  }
}