Promise实现原理，Class版本

最新推荐文章于 2024-07-30 23:06:43 发布

程序猿c

最新推荐文章于 2024-07-30 23:06:43 发布

阅读量109

点赞数 2

文章标签：前端 javascript vue.js

本文链接：https://blog.csdn.net/m0_56693499/article/details/135911371

版权

本文详细解析了JavaScriptPromise的核心概念，包括构造函数、PromiseStatus（pending,fulfilled,rejected），以及then方法的实现，展示了如何处理异步操作和错误处理。

摘要由CSDN通过智能技术生成

 class Promise {
      PromiseStatus = 'pending'
      PromiseResult = null
      callback = []
      constructor(executor) {
        let resolve = (data) => {
          if(this.PromiseStatus != 'pending') return 
          this.PromiseStatus = 'fulfilled'
          this.PromiseResult = data
          this.callback.forEach(item => {
            console.log(this.PromiseStatus)
            console.log(1)
            item.onResolved()
          })
        }
        let reject = (data) => {
          if(this.PromiseStatus != 'pending') return
          this.PromiseStatus = 'rejected'
          this.PromiseResult = data
          this.callback.forEach(item => {
            item.onRejected()
          })
        }
        try {
          executor(resolve, reject)
        } catch (error) {
          reject(error)
        }
      }
      then(onResolved, onRejected) {
        let call = (type) => {
          try {
            let result = type(this.PromiseResult)
            if(result instanceof Promise) {
              result.then(res => {
                resolve(res)
              }, err => {
                reject(err)
              })
            }
          } catch (error) {
            reject(err)
          }
        }
        return new Promise((resolve, reject) => {
          if(this.PromiseStatus === 'fulfilled') {
            call(onResolved)
          }
          if(this.PromiseStatus === 'rejected') {
            call(onRejected)
          }
          if(this.PromiseStatus === 'pending') {
            this.callback.push({
              onResolved:function() {
                call(onResolved)
              },
              onRejected:function() {
                call(onRejected)
              }
            }
            )
          }
        })
        }
        static resolve(data) {
          return new Promise((resolve, reject) => {
            if(data instanceof Promise) {
              data.then((res) => {
                resolve(res)
              }, (err) => {
                reject(err)
              })
            } else {
              resolve(data)
            }
          })
        }
    }