Promise之实现自己的promise①

frllk
146 阅读3分钟

这是我参与2022首次更文挑战的第5天，活动详情查看：2022首次更文挑战

Promises/A+规范详见：promisesaplus.com/

实现一个自己的Promise，主要需要实现的Interface & API有以下几个：

  • new Promise(executor)

  • promise.then([fulfillment], [rejection])

  • promise.catch([rejection])

  • promise.finally(handler)

  • Promise.resolve([value|promise])

  • Promise.reject([reason])

  • Promise.all(iterable)

  • Promise.race(iterable)

  • Promise.allSettled(iterable)

1. 搭建node环境

1. npm init -y
2. 设置dev命令：安装一下nodemon，需要忽略data下的所有文件“i ./data/”
 "scripts": {
    "dev": "nodemon ./index.js -i ./data/"
  }

目录结构如下：image.png

2. 相关术语

  • promise：是一个object或者function
  • thenable：是一个object或者function，定义了一个then的方法
  • value：是一个合法的JavaScript值（包括undefined、then、一个新的promise）
  • exception： 是一个值，通过throw抛出的异常
  • reason：是一个值，表示promise拒绝的理由

3. 要求

Promise的状态

一个Promise必须要有三个状态：pending（等待）, fulfilled（实现）, or rejected（拒绝）

  • 当pending的时候：一个promise可以变成一个fulfilled或者是一个rejected的状态
  • 当fulfilled的时候：1.一个promise就不能转换成其他的状态了; 2.必须要有一个value，并且是不能改变的
  • 当rejected的时候：1. 一个promise就不能转换成其他的状态了；2.必须有一个reason，并且是不能改变的

【注意】：不能改变是不可变的标识，并不意味着深度不可变的意思。比如value或者reason是一个对象的时候，对象里面的值是可以改变的（一个引用值内部是可以变的，引用是不可以变的）

then方法

一个promise必须提供一个then方法，可以去访问到一个promise抛出来的值（resolve出来的数据）或者是原因（rejected出来的结果） 一个promise的then方法可以接收两个参数，并且都是函数

promise.then(onFulfilled, onRejected)

  • 1.onFulfilled、onRejected都是可选的参数
    • 如果onFulfilled不是一个函数的话，它就会被忽略掉
    • 如果onRejected不是一个函数的话，它就会被忽略掉
  • 2.如果onFulfilled是一个function
    • 它必须是promise已经转为fulfilled之后才会被调用，promise的value值是then方法的第一个参数的值（resolve函数的参数）
    • 在promise转为fulfilled之前是不能被调用的
    • 不能被调用多次，最多只能调用一次
  • 3.如果onRejected是一个function
    • 它必须是promise已经转为rejected之后才会被调用，promise的reason值是then方法的第二个参数的值（reject函数的参数）
    • 在promise转为rejected之前是不能被调用的
    • 不能被调用多次，最多只能调用一次
  • 4.onFulfilled和onRejected函数直到执行上下文栈只包含平台代码时不能被调用（不太懂，也不知道解释对不对）
  • 5.onFulfilled和onRejected必须作为一个函数被调用（里面不能有this指向，单纯函数，不能被实例化）
  • 6.在同一个promise中then方法可以被调用多次
    • 当promise是fulfilled时，所有的then方法各自的onFulfilled函数必须要按照原先的这些调用的顺序去执行
    • 当promise是rejected时，所有的then方法各自的onRejected函数必须要按照原先的这些调用的顺序去执行
  • 7.then方法必须返回一个新的promise

promise2 = promise1.then(onFulfilled, onRejected);

avatar
文章
阅读
粉丝