手写Promise(es5 function版本 和 ES6 class版本)

ES5 function完整版本

//声明构造函数
function Promise(executor) {
    const self = this;
    //声明属性
    self.promiseStatus = 'pending';
    self.promiseValue = '';
    self.callbacks = [];
    //声明函数 resolve
    function resolve(data) {
        //状态修改唯一性
        if (self.promiseStatus !== 'pending') return;
        // resolve 修改 Promise 对象状态(promiseStatus)为成功, 设置其成功的值(promiseValue)
        //修改状态
        self.promiseStatus = 'resolved';
        //修改值
        self.promiseValue = data;
        //执行成功的回调
        setTimeout(() => {
            if (self.callbacks.length > 0) {
                self.callbacks.forEach(callbackObj => {
                    callbackObj.onResolved(self.promiseValue);
                });
            }
        })
    }
    //声明函数 reject
    function reject(data) {
        //如果状态修改过, 则直接返回
        if (self.promiseStatus !== 'pending') return;
        //修改状态
        self.promiseStatus = 'rejected';
        //修改值
        self.promiseValue = data;
        //执行失败的回调
        setTimeout(() => {
            if (self.callbacks.length > 0) {
                self.callbacks.forEach(callbackObj => {
                    callbackObj.onRejected(self.promiseValue);
                });
            }
        });
    }

    //执行『执行器函数』
    try {
        executor(resolve, reject);
    } catch (e) {
        //如果抛错 则修改 promise 对象状态为失败
        reject(e);
    }
}

//声明 Promise 原型中的 then 方法
Promise.prototype.then = function (onResolved, onRejected) {
    //默认值设置
    if (onRejected === undefined) {
        onRejected = reason => { throw reason };
    }

    if (onResolved === undefined) {
        onResolved = value => value;
    }

    return new Promise((resolve, reject) => {
        //封装函数
        let callback = (type) => {
            //如果函数执行抛出错误
            try {
                //获取回调的执行结果
                let result = type(this.promiseValue);
                //判断
                if (result instanceof Promise) {
                    result.then(v => {
                        resolve(v);
                    }, r => {
                        reject(r);
                    })
                } else {
                    //状态为成功
                    resolve(result);
                }
            } catch (e) {
                //如果回调抛出错误, 则修改 promise 对象状态为失败
                reject(e);
            }
        }
        //判断 promise 对象的状态
        //成功的状态
        if (this.promiseStatus === 'resolved') {
            setTimeout(() => {
                callback(onResolved);
            });
        }
        //失败的状态
        if (this.promiseStatus === 'rejected') {
            setTimeout(() => {
                callback(onRejected);
            })
        }
        //pending状态
        if (this.promiseStatus === 'pending') {
            //保存回调函数
            this.callbacks.push({
                onResolved: () => {
                    callback(onResolved);
                },
                onRejected: () => {
                    callback(onRejected);
                }
            });
        }
    })
}
//catch 方法实现
Promise.prototype.catch = function (onRejected) {
    return this.then(undefined, onRejected);
};
//resolve 方法 返回 promise 对象.
//传入的值影响返回对象的状态
Promise.resolve = function(value){
    //返回 promise 对象
    return new Promise((resolve, reject)=>{
        if(value instanceof Promise){
            value.then(v => {
                resolve(v);
            }, r => {
                reject(r);
            })
        }else{
            resolve(value);
        }
    });
};
//reject 方法 返回失败的 Promise 对象
Promise.reject = function(reason){
    return new Promise((resolve, reject)=>{
        reject(reason);
    });
}
//all 方法封装
Promise.all = function(promisesArr){
    //声明数组存放成功的值
    const resultArr = [];
    //计数器
    let count = 0;
    //设置promise结构
    return new Promise((resolve,reject)=>{
        //resolve 和 reject 调用的时机 ****
        for(let i=0;i<promisesArr.length;i++){
            //获取当前正在遍历的 promise 对象
            promisesArr[i].then(value =>{
                //将当前成功的 promise 的值 存入到数组中
                // resultArr.push(value);// 此方法不可取
                resultArr[i] = value;
                //计数器加一
                count++;
                //判断结果数组的长度 ['ok', undefined, 'Yeah!'].length ==3   count 2
                // ['OK','Success','Year']  count === 3  是所有 promise 成功的标志
                if(count === promisesArr.length){
                    //设置状态为成功
                    resolve(resultArr);
                }
            }, reason=>{
                //如果有一个 promise 失败, 则 all 返回的状态为失败
                reject(reason);
            })
        }
    });
}
//race 方法封装
Promise.race = function(promisesArr){
    //返回结构 promise 对象
    return new Promise((resolve, reject)=>{
        // resolve  reject 函数
        //遍历   标识符
        promisesArr.forEach(promise => {
            promise.then(value => {
                //如果 promise 对象成功, 则修改返回的 promise 对象状态为成功
                resolve(value);
            }, reason => {
                //如果 promise 对象失败, 则修改返回的 promise 对象状态为失败
                reject(reason);
            })
        });
    });
}

ES6 class完整版本

//声明 class
class Promise {
    //声明构造方法
    constructor(executor) {
        const self = this;
        //声明属性
        self.promiseStatus = 'pending';
        self.promiseValue = '';
        self.callbacks = [];
        //声明函数 resolve
        function resolve(data) {
            //状态修改唯一性
            if (self.promiseStatus !== 'pending') return;
            // resolve 修改 Promise 对象状态(promiseStatus)为成功, 设置其成功的值(promiseValue)
            //修改状态
            self.promiseStatus = 'resolved';
            //修改值
            self.promiseValue = data;
            //执行成功的回调
            setTimeout(() => {
                if (self.callbacks.length > 0) {
                    self.callbacks.forEach(callbackObj => {
                        callbackObj.onResolved(self.promiseValue);
                    });
                }
            })
        }
        //声明函数 reject
        function reject(data) {
            //如果状态修改过, 则直接返回
            if (self.promiseStatus !== 'pending') return;
            //修改状态
            self.promiseStatus = 'rejected';
            //修改值
            self.promiseValue = data;
            //执行失败的回调
            setTimeout(() => {
                if (self.callbacks.length > 0) {
                    self.callbacks.forEach(callbackObj => {
                        callbackObj.onRejected(self.promiseValue);
                    });
                }
            });

        }

        //执行『执行器函数』
        try {
            executor(resolve, reject);
        } catch (e) {
            //如果抛错 则修改 promise 对象状态为失败
            reject(e);
        }
    }

    //声明 then 方法
    then(onResolved, onRejected) {
        //默认值设置
        if (onRejected === undefined) {
            onRejected = reason => { throw reason };
        }

        if (onResolved === undefined) {
            onResolved = value => value;
        }

        return new Promise((resolve, reject) => {
            //封装函数
            let callback = (type) => {
                //如果函数执行抛出错误
                try {
                    //获取回调的执行结果
                    let result = type(this.promiseValue);
                    //判断
                    if (result instanceof Promise) {
                        result.then(v => {
                            resolve(v);
                        }, r => {
                            reject(r);
                        })
                    } else {
                        //状态为成功
                        resolve(result);
                    }
                } catch (e) {
                    //如果回调抛出错误, 则修改 promise 对象状态为失败
                    reject(e);
                }
            }
            //判断 promise 对象的状态
            //成功的状态
            if (this.promiseStatus === 'resolved') {
                setTimeout(() => {
                    callback(onResolved);
                });
            }

            //失败的状态
            if (this.promiseStatus === 'rejected') {
                setTimeout(() => {
                    callback(onRejected);
                })
            }

            //pending状态
            if (this.promiseStatus === 'pending') {
                //保存回调函数
                this.callbacks.push({
                    onResolved: () => {
                        callback(onResolved);
                    },
                    onRejected: () => {
                        callback(onRejected);
                    }
                });
            }
        })
    }

    //声明 catch 方法
    catch(onRejected) {
        return this.then(undefined, onRejected);
    }

    //声明 resolve 静态方法
    static resolve(value) {
        return new Promise((resolve, reject) => {
            if (value instanceof Promise) {
                value.then(v => {
                    resolve(v);
                }, r => {
                    reject(r);
                })
            } else {
                resolve(value);
            }
        });
    }

    //声明 reject 静态方法
    static reject(reason) {
        return new Promise((resolve, reject) => {
            reject(reason);
        });
    }

    //声明 all 静态方法
    static all(promisesArr) {
        //声明数组存放成功的值
        const resultArr = [];
        //计数器
        let count = 0;
        //设置promise结构
        return new Promise((resolve, reject) => {
            //resolve 和 reject 调用的时机 ****
            for (let i = 0; i < promisesArr.length; i++) {
                //获取当前正在遍历的 promise 对象
                promisesArr[i].then(value => {
                    //将当前成功的 promise 的值 存入到数组中
                    // resultArr.push(value);// 此方法不可取
                    resultArr[i] = value;
                    //计数器加一
                    count++;
                    //判断结果数组的长度 ['ok', undefined, 'Yeah!'].length ==3   count 2
                    // ['OK','Success','Year']  count === 3  是所有 promise 成功的标志
                    if (count === promisesArr.length) {
                        //设置状态为成功
                        resolve(resultArr);
                    }
                }, reason => {
                    //如果有一个 promise 失败, 则 all 返回的状态为失败
                    reject(reason);
                })
            }
        });
    }
    
    //声明 race 静态方法
    static race(promisesArr){
        return new Promise((resolve, reject)=>{
            // resolve  reject 函数
            //遍历   标识符
            promisesArr.forEach(promise => {
                promise.then(value => {
                    //如果 promise 对象成功, 则修改返回的 promise 对象状态为成功
                    resolve(value);
                }, reason => {
                    //如果 promise 对象失败, 则修改返回的 promise 对象状态为失败
                    reject(reason);
                })
            });
        });
    }
}