Promise实现原理记录

记录

const PENDING = 'PENDING'
const RESOLVED = 'RESOLVED'
const REJECTED = 'REJECTED'


class Promise {
    constructor(executor){
       //promise初始状态为PENDING
       this.status = PENDING
       this.data = null
       //then的回调
       this.callbacks = []
       
       //resolve
       const resolve = (value) => {
          if(this.status === PENDING){
            this.status = RESOLVED
            this.data = value
            
            if(this.callbacks.length>0){//异步执行then里面回调函数
                setTimeout(() => {
                    this.callbacks.forEach(ele => ele.onResolved(value))  
                });
            }
          }
       }
       //reject
       const reject = (reason) => {
        if(this.status === PENDING){
          this.status = REJECTED
          this.data= reason
          if(this.callbacks.length>0){
             setTimeout(()=>{
                this.callbacks.forEach(ele => {
                    ele.onRejected(reason)
                })
             })
          }
        }
     }

      try{
        executor(resolve,reject)
      }catch(e){
         reject(e)
      }
    }

    then(onResolved,onRejected){
        const that = this;
        // 指定回调函数的默认值(必须是函数)
        onResolved = typeof onResolved === 'function'?onResolved:value =>value  //继续向下传递
        onRejected = typeof onRejected ==='function'? onRejected:reason =>{throw reason}  //抛出异常
    //   当前状态还是pending时候存入回调队列等待resolve或reject执行
      return new Promise((resolve,reject)=>{//返回promise状态根据onResolved|onRejected结果判断
        function handle(callback){//函数处理
            try {
                const result = callback(that.data) 
                if(result instanceof Promise){//3 想要知道promise的结果必须调用其then方法
                 result.then(resolve,reject) //简写相当于把resolve||reject当作onResolved||reJected传入 promise内部会自动调用
                }else{//2
                  resolve(result)
                }
             } catch (error) {//1
                 reject(error)
             } 
        }
        if(that.status === PENDING){//padding先存人callback 并且要改变promise状态
            this.callbacks.push({
                onResolved(value){
                    handle(onResolved)
                },
                onRejected(reason){
                    // onRejected(that.data)
                   handle(onRejected)
                }
            })
          }else if(that.status === RESOLVED){//如果成功直接调
              setTimeout(() => {
                /**?1
                 * 1.如果抛出异常,return的promise就会失败,reason就是error
                 * 2.如果回调函数返回不是promise,return的promise就会成功,value就是回调函数返回的值
                 * 3.如果回调函数返回的是promise,return的promise结果就是回调函数返回promise的结果
                 */
                // try {
                //    const result = onResolved(that.data) 
                //    if(result instanceof Promise){//3 想要知道promise的结果必须调用其then方法
                //     result.then(resolve,reject) //简写相当于把resolve||reject当作onResolved||reJected传入 promise内部会自动调用
                //     //   result.then(
                //     //     value=>{
                //     //       resolve(value)
                //     //   },reason=>{
                //     //      reject(reason)
                //     //   })
                //    }else{//2
                //      resolve(result)
                //    }
                // } catch (error) {//1
                //     reject(error)
                // } 
                handle(onResolved)
              });
          }else{
            setTimeout(() => {//如果失败直接调
                handle(onRejected)
              });
          }

      })
    }

    catch(onRejected){
      return this.then(undefined,onRejected) 
    }

    static resolve(value){
        return new Promise((resolve,reject)=>{
            if(value instanceof Promise){
                value.then(resolve,reject)
            }else{
              resolve(value)
            }
       })
    }

    static reject(reason){
        return new Promise((resolve,reject)=>{
             reject(reason)
        })
    }

    static resolveDelay(value,time){//指定时间后才确定结果
        return new Promise((resolve,reject)=>{
            setTimeout(()=>{
                if(value instanceof Promise){
                    value.then(resolve,reject)
                }else{
                  resolve(value)
                }
            },time)
        })
    }
    static rejectDelay(reason,time){//指定时间后才失败
        return new Promise((resolve,reject)=>{
           setTimeout(()=>{
             reject(reason)
           },time)
        })
    }
   //返回一个promise,全部成功才成功,一个失败就是失败 
    static all(promises){
        const values = new Array(promises.length)
        let resolveCount = 0
        return new Promise((resolve,reject)=>{
           promises.forEach((p,index)=>{
             Promise.resolve(p).then(v=>{//防止出现不是promise实列的数据 Promise.resolve(p)
                resolveCount++
                values[index] = value
                if(resolveCount === promises.length){
                    resolve(v)
                }
             },
             r=>{//一个失败就掉reject
                 reject(r)
             }) 
           })
       })
    }
   
    static race(promises){
        return new Promise((resolve,reject)=>{
            promises.forEach((p,index)=>{
                Promise.resolve(p).then(v=>{
                    resolve(v)
                 },
                 r=>{//一个失败就掉reject
                     reject(r)
                 })
            })
        })
    } 
}
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值