当前位置:首页 > ES6 > 正文内容

自己实现最基础的promise

自由小鸟5年前 (2019-12-02)ES62409

没事自己手写了一下

let pi=new Promise((resolve,reject)=>{
    resolve(100);
    reject(0);
})
p1.then(result=>{
    console.log('成功'+result)
},reason=>{
    console.log('失败'+reason)
})
console.log('ok')

//打印出来是 
ok  
成功+100
class MyPromise{
    constructor(executor){
        //初始状态
        this.status='pending';
        this.value=undefined;

        //来控制执行resolve和reject的时候执行对应then里的函数方法
        this.resolveArr=[];
        this.rejectArr=[];

        //执行的改变状态的方法
        let changeStaus=(status,result)=>{
            if(this.status!=='pending') return;  //2,如果有一个执行了,下一个不会执行
                this.status=status;
                this.value=result;
                let arr=status==='rejected'?this.rejectArr:this.resolveArr
                //执行resolve函数
                arr.map(item=>{
                    if(typeof item==='function'){
                        item(this.value);
                    }
                })
        }
        //改变状态函数
        let resolve=(result)=>{
            if(this.resolveArr.length>0){
                changeStaus('resolved',result);
                return;
            }
            let delayTimer=setTimeout(()=>{
                clearTimeout(delayTimer);
                changeStaus('resolved',result);
            },0)


        };   //resolve(100)
        let reject=(reason)=>{
            if(this.rejectArr.length>0){
                changeStaus('rejected',reason);
                return;
            }
            let delayTimer=setTimeout(()=>{
                changeStaus('rejected',reason);
            },0)


        };    //reject('错误信息')

        //这里需要处理一下异常错误
        try{
            executor(resolve,reject); //执行函数
        }catch(error){
            reject(error)
        }

    }

    //添加方法
    then(resolveFn,rejectFn){
        this.resolveArr.push(resolveFn);
        this.rejectArr.push(rejectFn);
    }

}

module.exports=MyPromise;

版权声明:本文由Web学习之路发布,如需转载请注明出处。

本文链接:https://webge.net/?id=83

返回列表

上一篇:精选之Promise

没有最新的文章了...

“自己实现最基础的promise” 的相关文章

es6 解构函数默认值

es6 解构函数默认值

1,如果函数对数解构值有默认值的情况,调用传值参数不传不会报错2,如果出现解构值没有默认值,那当传参数的时候没有传就会报错...