手写promise核心代码

最新推荐文章于 2025-11-24 03:12:01 发布

原创最新推荐文章于 2025-11-24 03:12:01 发布 · 155 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

本文详细介绍了Promise对象的内部实现，包括PENDING、FULFILLED和REJECTED三种状态转换，以及构造函数、resolve和reject方法。同时展示了如何通过then方法进行回调处理，解释了Promise链式调用的工作原理。

class Promise {
      static PENDING = "待定"; static FULFILLED = "成功"; static REJECTED = "失败"
      constructor(func) {
        this.state = Promise.PENDING
        this.result = null
        this.resolveCallbacks = []
        this.rejectCallbacks = []

        try {
          func(this.resolve.bind(this), this.reject.bind(this))
        } catch (error) {
          this.reject(error)
        }
      }

      resolve(result) {
        setTimeout(() => {
          if (this.state === Promise.PENDING) {
            this.state = Promise.FULFILLED
            this.result = result;
            this.resolveCallbacks.forEach(callback => callback(result))
          }
        })
      }

      reject(result) {
        setTimeout(() => {
          if (this.state === Promise.PENDING) {
            this.state = Promise.REJECTED
            this.result = result;
            this.rejectCallbacks.forEach(callback => callback(result));
          }
        })
      }

      then(onFULFILLED, onREJECTED) {
        return new Promise((resolve, reject) => {
          onFULFILLED = typeof onFULFILLED === 'function' ? onFULFILLED : () => { }
          onREJECTED = typeof onREJECTED === 'function' ? onREJECTED : () => { }
          if (this.state === Promise.PENDING) {
            this.resolveCallbacks.push(onFULFILLED)
            this.rejectCallbacks.push(onREJECTED)
          }
          if (this.state === Promise.FULFILLED) {
            setTimeout(() => {
              onFULFILLED(this.result)
            })
          }

          if (this.state === Promise.REJECTED) {
            setTimeout(() => {
              onREJECTED(this.result)
            })
          }
        })
      }
    }

    let promise = new Promise((resolve, reject) => {
      resolve("111")
      // throw new Error("报错了")
    });
    promise
      .then(
        result => {
          console.log(result)
        }, result => {
          console.log(result.message)
        })
      .then(
        result => {
          console.log(result)
        }, result => {
          console.log(result.message)
        })