手写Promise自定义封装 then 函数

原创

朦胧淡月 2022-09-01 17:03:26 博主文章分类：promise ©著作权

©著作权归作者所有：来自51CTO博客作者朦胧淡月的原创作品，请联系作者获取转载授权，否则将追究法律责任

Promise 自定义封装 then 函数

<script src="./Promise.js"></script>
<script type="text/javascript">
    let p = new Promise((resolve, reject) => {
        resolve('ok');
    })
    p.then(res => {
        console.log('res', res)
    }, err => {
        console.log(err)
    })
</script>

我们现在发现，then方法中压根就没有输出内容；
是因为我们对then函数没有进行封装；
所以现在我们需要对then函数进行一次封装了
怎么封装了？？？？？？？？？？？、

31 自定义封装 then 方法执行回调

function Promise(executor){
    const self=this;
    function resolve(data){
        // 如果状态发生改变就直接返回(为了让Promise的状态只发生一次改变)；
        if( self.PromiseStatus!=='pending') return
        self.PromiseStatus='resolved';
        self.PromiseValue=data;
    }
    // 同样声明成为一个函数;修改状态
    function reject(err){
        // 如果状态发生改变就直接返回(为了让Promise的状态只发生一次改变)；
        if( self.PromiseStatus!=='pending') return
        self.PromiseStatus='rejected';
        self.PromiseValue=err;
    }
    this.PromiseStatus ='pending' ;
    this.PromiseValue =null;

    // 对异常进行处理；使用try catch
    try{
        executor(resolve,reject);
    }catch(err){
        reject(err);
    }
}
// 自定义封装then方法执行回调
Promise.prototype.then=function(onResolve,onReject){
    //下面的this是指向实例对象p的哈;
    //{PromiseStatus:"resolved"PromiseValue:"ok"}
    if(this.PromiseStatus==='resolved'){
        onResolve(this.PromiseValue)
    }
    if(this.PromiseStatus==='rejected'){
        onReject(this.PromiseValue)
    }
}