Promise原理解析与实现

Promise原理解析与实现

知识要点

  • Promise 类
  • Promise 状态
  • promise.resolve 方法实现
  • promise.reject 方法实现
  • promise.then 方法实现
  • promise.catch 方法实现

介绍

PromiseJavaScript 异步编程的一种流行解决方案,使用原生手写方式一步一步的带你实现 Promise

Promise 类

Promise 的构造函数必须接收一个函数参数(也就是需要执行异步任务的函数),该函数将在传入以后立即调用,并传入 Promise 对象下的两个方法 resolvereject

Promise 状态

每一个 Promise 对象都存在以下三种状态:

  • PENDING : 进行中,Promise 对象的初始状态
  • FULFILLED : 已成功
  • REJECTED : 已失败

每一个 Promise 对象只能由 PENDING 状态变成 FULFILLEDREJECTED,且状态发生变化以后就能再改变了
一个 Promise 对象状态的变化由传入的异步任务完成情况来决定的,Promise 提供了两个用来改变状态的方法

promise.#resolve 方法

Promise 对象的状态从 PENDING 变为 FULFILLED,并执行成功后的注册任务

注意:如果当前状态已经改变过了,则直接 return

promise.#reject 方法

Promise 对象的状态从 PENDING 变为 REJECTED,并执行失败后的注册任务

注意:如果当前状态已经改变过了,则直接 return

promise.then 方法

接收两个函数作为参数,根据当前 Promise 的状态来做不同的处理

  • PENDING : 添加到对应的任务队列
  • FULFILLED / REJECTED : 不用添加到队列,而是立即执行任务
    then(resolve)简写

返回值

then 方法在执行最后必须返回一个新的 Promise 对象

简而言之:把新返回的 Promise 对象的 resolverejectthen 中执行的 fulfilledHandlerrejectedHandler 添加到一个任务队列中执行,这样才能使用原有的 then 执行完成以后才执行新的 Promise 中的 then
当一个[Promise]

  • 如果then中的回调函数没有返回值,那么then返回的Promise将会成为接受状态,并且该接受状态的回调函数的参数值为 undefined。
  • 如果then中的回调函数返回一个值,那么then返回的Promise将会成为接受状态,并且将返回的值作为接受状态的回调函数的参数值。
  • 如果then中的回调函数抛出一个错误,那么then返回的Promise将会成为拒绝状态,并且将抛出的错误作为拒绝状态的回调函数的参数值。
  • 如果then中的回调函数返回一个已经是接受状态的Promise,那么then返回的Promise也会成为接受状态,并且将那个Promise的接受状态的回调函数的参数值作为该被返回的Promise的接受状态回调函数的参数值。
  • 如果then中的回调函数返回一个已经是拒绝状态的Promise,那么then返回的Promise也会成为拒绝状态,并且将那个Promise的拒绝状态的回调函数的参数值作为该被返回的Promise的拒绝状态回调函数的参数值。
  • 如果then中的回调函数返回一个未定状态(pending)的Promise,那么then返回Promise的状态也是未定的,并且它的终态与那个Promise的终态相同;同时,它变为终态时调用的回调函数参数与那个Promise变为终态时的回调函数的参数是相同的。

promise.catch 方法

promise.finally 方法

ECMA2018 Added

Promise.resolve 方法

Promise.reject 方法

Promise.all 方法

//不需要reject
(resolve)=>{

}

Promise.race 方法

上一篇:ES6 Promise


下一篇:Promise.resolve() 的应用