理解Promise (3)

在promise  的then  中我们不仅有 成功状态 失败状态,可能还有等待状态,所以我们要对等待状态进行处理

function  Promise(executor) {
    let  self  = this;
    self.value = null;
    self.reason = null;
    self.resolveCallback = [];
    self.rejectCallback = [];
    //设置默认状态
    self.status = 'pending'
    //成功函数
    function  resolve(value) {
        if(self.status=='pending') {
            self.status = 'success';
            // console.log(self.value);
            self.value =  '运行成功了';
            self.resolveCallback.forEach(fn=>fn()); // 发布
        }
    };
    //失败函数
    function  reject(reason) {
        if(self.status == 'pending') {
            self.status = 'fail';
            self.reason = '运行失败了';
            self.rejectCallback.forEach(fn=>fn()); // 发布
        }
    }
    //默认立即执行函数 传递两个参数 
    executor(resolve,reject);
}
Promise.prototype.then =  function(OnResolve,OnReject) {
    // console.log(this.value)
        if(this.status == 'success') {
            OnResolve(this.value);
        }
        if(this.status =='fail') {
            OnReject(this.reason);
        }
        //第3种状态 处于等待状态
        if(this.status == 'pending') {
            //将成功的回调push 到 resolveCallback 这个数组中
            this.resolveCallback.push(()=>{
                OnResolve(this.value);
            })
            //将失败的回调 push 到  rejectCallback 这个数组中
            this.rejectCallback.push(()=>{
                OnReject(this.reason);
            })
        }
};
module.exports= Promise;
//一进来 我们开始执行 executor函数 传递两个参数 再调用 then 方法 ,then 方法里面有  OnResolve方法,OnReject 方法
// then 方法中,我们一开始的状态是pending  然后根据 状态的不同 调用不同的函数,
// 在两个不同的函数中 我们 进行判断 因为状态一开始都是有 pending  = >  success 或者 pending =>fail
// 判断 时修改 状态 和 显示值
 

在 then  方法中 我们先进行状态的判断 ,如果这个状态是 pending  状态 ,我们就对它进行处理

首先先声明 成功状态的回调数组 为空 失败状态的回调数组为空

  self.resolveCallback = [];
    self.rejectCallback = [];

在等待状态中 我们将  成功的函数 push 到 成功状态的回调数组 中,将失败函数push  到失败状态的回调 数组中

 //将成功的回调push 到 resolveCallback 这个数组中
            this.resolveCallback.push(()=>{
                OnResolve(this.value);
            })
            //将失败的回调 push 到  rejectCallback 这个数组中
            this.rejectCallback.push(()=>{
                OnReject(this.reason);
            })

同时我们将 状态的值传递进去

 

最后 在各自的执行函数进行数组的遍历 调用自身的函数

  self.resolveCallback.forEach(fn=>fn()); // 发布

 

posted @ 2019-08-04 20:54  1点  阅读(152)  评论(0编辑  收藏  举报