ES6完全学习笔记 之 Promise

Promise 的含义

含义与概念

• Promise 是异步编程的一种解决方案。相对于传统的解决方案—回调函数和事件—更合理更强大。
• 所谓 Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。

Promise 对象有两个特点：

• 对象的状态不受外界影响。
  • Promise 对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）、rejected（已失败）。
  • 只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。
• 一旦状态改变，就不会再变，任何时候都可以得到这个结果。
  • Promise 对象的状态改变，只有两种可能：从 pending 变为 fulfilled 和从 pending 变为 rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。
  • 如果改变已经发生了，你再对 Promise 对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。
• 缺点：
  • 无法取消 Promise，一旦新建它就会立即执行，无法中途取消。
  • 如果不设置回调函数，Promise 内部抛出的错误，不会反应到外部。
  • 当处于 pending 状态时，无法得知目前进展到哪一个阶段。

基本用法

创建 Promise 实例

• Promise 对象是一个构造函数，用来生成 Promise 实例。代码如下：

const promise = new Promise(function (resolve, reject) {

    if ( /* 异步操作成功 */ ) {
        resolve(value)
    } else {
        reject(error)
    }

})

• Promise 构造函数接受一个函数作为参数，该函数参数分别为以下两个函数：

  • resolve 函数
    • 作用是将 Promise 对象的状态从“未完成”变为“成功”，即 pending->fulfilled。
    • 一般在异步操作成功时被调用，并将异步操作的结果，作为参数传递出去。

  • reject 函数

    • 作用是将 Promise 对象的状态从“未完成”变成“失败”，即 pending->rejected。
    • 一般在异步操作失败时被调用，并将异步操作报出的错误，作为参数传递出去。

用 then 方法指定回调函数

• Promise 实例生成后，可以用 then 方法分别指定 resolved 状态和 rejected 状态的回调函数。代码如以下：

promise.then(function (value) {
    // success
}, function (error) {
    // failure
});

• then 方法可以接受两个回调函数作为参数。第一个回调函数是 Promise 对象的状态变为 resolved 时调用，第二个回调函数是 Promise 对象状态变为 rejected 时调用。这两个函数都是可以选的，不一定要提供。它们都接受 Promise 对象传出的值作为参数。

Promise.prototype.then()

作用

• 为 Promise 实例添加状态改变时的回调函数

返回值

• then 方法返回的是一个新的 Promise 实例（注意 不是原来那个 Promise 实例）
• 因为上面的缘故，then 支持链式写法，形如：then(…).then(…)…

Promise.prototype.catch()

作用

• catch 方法是.then(null, rejection) 或 .then(undefined, rejection)的别名，用于指定发生错误时的回调函数。

注意事项

• 异步操作抛出错误，状态就会变为 rejected，就会调用 catch 方法指定的回调函数来处理错误。

• then 方法指定的回调函数，如果运行中抛出错误，也会被 catch 方法捕获。

• 如果 Promise 状态已变成 resolved，再抛出错误就是无效的。

• Promise 对象的错误具有冒泡性质，会一直向后传递，直到被捕获为止。也就是错误总会被下一个 catch 语句捕获。

综上所述，建议总是使用 catch 方法，而不使用 then 方法的第二个参数（即不在 then 方法中定义 reject）。
跟传统的 try/catch 代码块不同的是，如果没有使用 catch 方法指定错误处理的回调函数，Promise 对象抛出的错误不会传递到外层代码，即不会有任何反应。

返回值

• catch 方法返回值还是一个 Promise 对象

Promise.prototype.finally()

作用

• finally 方法用于指定不管 Promise 对象最后状态如何，都会执行的操作。

注意事项

• finally 方法的回调函数不接受任何参数。

• finally 方法总是返回原来的值。

Promise.all()

作用

• all 方法用于将多个 Promise 实例，包装成一个新的 Promise 实例。

参数

• all 方法的参数可以是数组，或者具有 Iterator 接口，但数据元素和接口成员必须都是 Promise 实例，如果不是会先调用 Promise.resolve 方法，将参数转化为 Promise 实例，再进一步处理。

状态（假设 P.all 方法包含了 P1、P2、P3 三个 Promise 实例）

• 只有 P1、P2、P3 的状态都变成 fulfilled，P 的状态才会变成 fulfilled，此时 P1、P2、P3 的返回值组成一个数组，传递给 P 的回调函数。

• 只要 P1、P2、P3 之中有一个被 rejected，P 的状态就会变成 rejected，此时第一个被 reject 的实例的返回值，会传递给 P 的回调函数。

注意事项

• 如果作为参数的 Promise 的实例，自己定义了 catch 方法，那么它一旦被 rejected，并不会触发 Promise.all 的 catch 方法。

Promise.race()

作用

• 同样是将多个 Promise 实例，包装成一个新的 Promise 实例。

状态（假设 P.all 方法包含了 P1、P2、P3 三个 Promise 实例）

• 只要 P1、P2、P3 之中有一个实例率先改变状态，P 的状态就跟着改变。那个率先改变的 Promise 实例的返回值，就传递给 P 的回到函数。

Promise.allSettled() ES2020

作用

• 用来确定一组异步操作是否都结束了（不管成功或失败）。

状态

• Promise.allSettled 的返回值 allSettledPromise 的状态只可能变成 fulfilled。

返回值

• 回调函数接受到的参数是数组 results，其对象的格式是固定的，对应异步操作结果。

// 异步操作成功时
{status: 'fulfilled', value: value}

// 异步操作失败时
{status: 'rejected', reason: reason}

Promise.any() ES2021

作用

• 同样是接受一组 Promise 实例作为参数，包装成一个新的 Promise 实例返回。

状态

• 只要有一个参数实例变成 fulfilled，包装的新实例就会变成 fulfilled;

• 所有参数实例都变成 rejected，包装实例才会变成 rejected。

注意事项

• Promise.any 抛出错误，不是一个一般的 Error 错误对象，而是一个 AggregateError 实例，相当于一个数组，每个成员对应一个被 rejected 的操作所抛出的错误。

Promise.resolve()

作用

• 将现有对象转为 Promise 对象

应用举例

// 将jQuery生成的deferred对象，转为一个新的Promise对象。

参数

• 参数是一个 Promise 实例
• 参数是一个 thenable 对象
• 参数不是具有 then 方法的对象，或者根本就不是对象
• 不带有任何参数

事件循环

setTimeout(function () {
  console.log('three');
}, 0);

Promise.resolve().then(function () {
  console.log('two');
});

console.log('one');

// one
// two
// three

上面代码中，setTimeout(fn, 0)在下一轮“事件循环”开始时执行，Promise.resolve()在本轮“事件循环”结束时执行，console.log(‘one’)则是立即执行，因此最先输出。

Promise.reject()

作用

• 返回一个状态为 rejected 的 Promise 实例。

参数

• 传入参数会原封不动的作为 reject 的理由，变成后续方法的参数。

Promise.try()

• 模拟 try 代码块。