Promise 学习教程

183 阅读4分钟

1. Promise 是什么?

  1. Promise是一个构造函数,用来创建对象
  2. Promise是用来解决异步编程的(传统异步编程解决方案:回调函数和事件)
  3. 是ES6的语法

1.1 描述

Promise对象用来封装一个异步操作并可以获取其成功/失败的结果值。

Promise对象(PromiseState属性)有以下三个状态:

  • pending:初始状态,异步操作既没有完成,也没有操作失败
  • fulfilled:异步操作完成
  • rejected:异步操作失败

注意:一旦状态改变,就不会再变,任何时候都可以得到这个结果。 状态的变化,只能是:pending->fulfiledpending->rejected

Promise对象的值(PromiseResult属性),即异步任务成功或失败的结果。resolvereject函数可以修改这个值。

1.2 Promise 的基本流程

image.png

1.3 Promise API

1.3.1 Promise(executor)(构造函数)

参数:

  • executor():执行器函数((resolve, reject) => {}
  • resolve():内部定义的,异步操作成功时我们调用的函数(value => {}
  • reject():内部定义的,异步操作失败时我们调用的函数(reason => {}

说明:executor会在Promise内部立即同步调用,异步操作在执行器中执行

1.3.2 Promise.prototype.then(onResolved, onRejected)(指定回调函数)

参数:

  • onResolved():异步操作成功时的回调函数(value => {}
  • onRejected():异步操作失败时的回调函数(reason => {}

说明:指定用于异步操作成功或失败时的回调函数,返回一个新的promise对象。

1.3.3 Promise.prototype.catch(onRejected)(指定异步操作失败的回调函数)

参数:

  • onRejected():异步操作失败的回调函数 说明:then()的语法糖,相当于:then(undefined, onRejected)

1.3.4 Promise.resolve():value => {}

参数:

  • value:成功的数据或promise对象 说明:返回一个成功或失败的对象。Promise函数对象的方法,不是实例对象的方法。
  • value不是promise对象时,始终返回一个成功的promise对象,且其PromiseResultvalue
  • value是一个promise对象时,返回的promise对象成功或失败由valuePromiseState决定,值为valuePromiseResult

1.3.5 Promise.reject():reason => {}

参数:

  • reason:失败的原因 说明:返回一个失败的promise对象。无论传入什么数据,返回结果始终为一个失败的promise对象。

1.3.6 Promise.all():promises => {}

参数:

  • promises:包含n个promise对象的数组 说明:返回一个新的promise,只有所有的promise都成功,才会成功,否则直接失败(PromiseResult由失败的promise对象决定)。

1.3.7 Promise.race():promises => {}

参数:

  • promises:包含n个promise对象的数组 说明:返回一个新的 promise, 第一个完成的 promise 的结果状态就是最终的结果状态。

1.4 promise的几个关键问题

1.4.1 如何改变promise的状态?

  1. 调用resolve(value):如果当前是pending,则变成fulfilled
  2. 调用reject(reason):如果当前是pending,则变成rejected
  3. 抛出异常:如果当前是pending,则变成rejected

1.4.2 一个promise指定多个成功/失败回调函数,都会调用吗?

当 promise 改变为对应状态时都会调用。

image.png

1.4.3 改变promise状态和指定回调函数谁先谁后?

  1. 都有可能。正常情况下是先指定回调,再改变状态。
  2. 如何先改变状态再指定回调?
    • 在执行器中直接调用resolve()/reject()
    • 延迟更长时间才调用then()
  3. 什么时候才能得到数据?
    • 如果先指定回调,那当状态发生改变时,回调函数就会调用,得到数据。
    • 如果先改变状态,那当指定回调时,回调函数就会调用,得到数据

1.4.4 promise.then()返回的新promise的结果状态由什么决定?

  1. 简单表达:由then()指定的回调函数执行的结果决定
  2. 详细表达:
    • 如果抛出异常,新promise变为rejectedreason为抛出的异常
    • 如果返回的是非promise的任意值,新promise变为resolvedvalue为返回的值
    • 如果返回的是另一个新promise,此promise的结果就会称为新promise的结果

1.4.5 promise如何串联多个操作任务?

  1. promise的then()返回一个新的promise,可以使用then()的链式调用
  2. 通过then()的链式调用串联多个同步/异步任务

1.4.6 promise 异常穿透?

  1. 当使用promise的then()链式调用时,可以在最后指定失败的回调
  2. 前面任何操作出了异常,都会传到最后失败的回调中处理

1.4.7 中断promise链?

  1. 当使用 promise 的then()链式调用时,在中间中断,不再调用后面的回调函数
  2. 办法:在回调函数中返回一个pending状态的promise对象