【Promise】手写实现方法

手写promise的两种实现方法
1、class实现
2、函数实现
手写promise，首先要确认好promise的状态，主要有三种：pending、filfulled、rejected，其次是定义好filfulled的返回值value跟rejected的返回值reason，然后是resolve跟reject方法实现status改变及返回值更新，最后是then的实现，为promise的回调。

注意：对于异步事件使用事件订阅发布实现监听

1、class实现

//实现promise
class _promise{
    
    constructor(excutor){
        var self = this;
        this.status = 'pending';
        this.value = null;
        this.reason = null;
        
        //事件缓存列表
        this.onFilfulledFns = []
        this.onRejectedFns = []

        //resolve
        function resolve(value){
            if(self.status === 'pending'){
                self.value = value;
                self.status = 'filfulled';
                //事件发布
                self.onFilfulledFns.forEach(fn => fn(value))
            }
        }
        //reject
        function reject(reason){
            if(self.status === 'pending'){
                self.value = reason;
                self.status = 'rejected';
                //事件发布
                self.onRejectedFns.forEach(fn => fn(reason))
            }
        }

        //执行器
        try{
            excutor(resolve,reject)
        }catch(err){
            this.reject(err)
        }
    }
    //then
    then(onFilfulled,onRejected){
        if(this.status === 'pending'){
            //事件订阅
            this.onFilfulledFns.push(onFilfulled);
            this.onRejectedFns.push(onRejected)
        }else if(this.status === 'filfulled'){
            onFilfulled(this.value)
        }else{
            onRejected(this.reason)
        }
    }
}

2、函数实现

/**
 * 
 * @param {*} excutor 执行器
 */
function MyPromise(excutor){



    let self = this;
    this.status = 'pending';
    this.value = null;
    this.reason = null;



    //事件缓存
    this.fulfilledFns = [];
    this.rejectedFns = [];
    // 成功响应
    function resolve(value){
        if(self.status === 'pending'){
            self.value = value;
            self.status = 'fulfilled';
            //事件发布
            self.fulfilledFns.forEach(fn => fn(value))
        }
    }
    // 失败事件
    function reject(reason){
        if(self.status === 'pending'){
            self.reason = reason;
            self.status = 'rejected';
            //事件发布
            self.rejectedFns.forEach(fn => fn(reason))
        }
    }



    //执行器
    try{
        excutor(resolve,reject)
    } catch(err){
        reject(err)
    }
}



//then
MyPromise.prototype.then = function(onFulfilled,onRejected){
    let self = this;
    //异步事件订阅
    if(self.status === 'pending'){
        self.fulfilledFns.push(onFulfilled)
        self.rejectedFns.push(onRejected)
    }else if(self.status === 'fulfilled'){
        onFulfilled(self.value)
    }else{
        onRejected(self.reason)
    }



}



let demo = new MyPromise((resolve,reject)=>{
    console.log('小伙很认真')
    setTimeout(() => {
        // 异步执行
        resolve(1)
    }, 1000);
})



demo.then(data=>{
    console.log(data)
})