手写promise 库 分析其原理

promise为什么会产生?

解决异步问题

1.多个异步请求并发(希望同步最终的结果)promise.all

2.链式异步请求问题 上一个人的输出是下一个人的出入 promise的链式调用可以解决这个问题

3.缺陷:还是基于回调

promise是一个类

1.promise有三个状态 成功态(resolve)   失败态(reject)  等待态(pending)(又不成功又不失败)

2.用户自己决定失败的原因和失败的原因  成功和失败也是用户定义的

3.promise默认执行器是立即执行

4.promise的实例都有一个then方法,一个是成功的回调,一个是失败的回调

5.如果执行函数时发生了异常也会执行失败逻辑

6.如果promise一旦成功就不能失败,反过来也是一样的

const RESOLVE = 'RESOLVE';
const REJECT = 'REJECT';
const PENDING = 'PENDING';
const resolvePromise = (promise2,x,resolve,reject)=>{
    if(promise2===x) new TypeError('类型错误')
    let called;
    if((typeof x ==='object'&&x!=null)|| typeof x ==='function'){
        try {
            let then = x.then;
            if(typeof then==='function'){
                then.call(x,y=>{
                    if(called) return;
                    called=true
                    resolvePromise(promise2,y,resolve,reject)

                },err=>{
                    if(called) return;
                    called=true
                    reject(err)
                })
            }else{
                resolve(y)
            }
        } catch (error) {
            if(called) return;
            called=true
            reject(error)
        }
    }else{
        resolve(x)
    }

}
class Promise {
    constructor(excutor){
        this.status=PENDING;
        this.value = undefined;
        this.reason = undefined;
        this.onResolvedcallbacks = [];
        this.onRejectedcallbacks = [];
        let resolve =(value)=>{
            this.status = RESOLVE;
            this.value = value;
            this.onResolvedcallbacks.forEach(fn=>fn())
        }
        let reject = (reason)=>{
            this.status = REJECT;
            this.reason = reason;
            this.onRejectedcallbacks.forEach(fn=>fn())
        }
        try {   
            excutor(resolve,reject)
        } catch (error) {
            reject(error)
        }
    }
      // 1.promise 成功和失败的返回值 可以传递到外层的下一个then
  // 2.如果返回的是普通值的话(传递到下一次成功中,不是错误不是promise就是普通值),出错的情况(一定会走到下一次的失败),
  // 可能还要promise的情况(会采用promise的状态,决定下一次的丞还是失败)
  // 3.错误处理 如果离自己最近的then没有错误处理 会向下找
  // 4.每次执行完promise.then方法反悔的都是一个新的promise
  then(onFulfilled,onRejected){
      onFulfilled=typeof onFulfilled==='function'?onFulfilled:v=>v;
      onRejected = typeof onRejected ==='function'?onRejected:err=>{throw err}
      let promise2 = new Promise((resolve,reject)=>{
          if(this.status===RESOLVE){
              setTimeout(()=>{
                try {
                    let x = onFulfilled(this.value)
                    resolvePromise(promise2,x,resolve,reject)
                } catch (error) {
                    reject(error)
                }
               
              },0)
          }
          if(this.status===REJECT){
            setTimeout(()=>{
                try {
                    let x = onRejected(this.reason)
                    resolvePromise(promise2,x,resolve,reject)
                } catch (error) {
                    reject(error)
                }
               
              },0)
          }
          if(this.status===PENDING){
                this.onResolvedcallbacks.push(()=>{
                    let x = onFulfilled(this.value)
                    resolvePromise(promise2,x,resolve,reject)
                })
                this.onRejectedcallbacks.push(()=>{
                    let x = onRejected(this.reason)
                    resolvePromise(promise2,x,resolve,reject)
                })
          }
      })
      return promise2
  }
}
// promise的延迟对象
Promise.defer = Promise.deferred = function(){
    let dfd = {};
    dfd.promise = new Promise((resolve,reject)=>{
        dfd.resolve = resolve;
        dfd.reject = reject
    })
    return dfd
} 

module.exports = Promise

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值