重读promise

重逢Promise

// 状态映射表
const STATE_MAPPING = {
    PENDING: 'pending',
    RESOLVED: 'resolved',
    REJECTED: 'rejected'
};

class MyPromise {
    constructor(exector) {
        this.init();
        const resolve = val => {
            if (this.status !== STATE_MAPPING.PENDING) {
                return;
            }
            this.status = STATE_MAPPING.RESOLVED;
            this.value = val;
            this.onResolvedCallbacks.forEach(fn => fn());
        };
        const reject = val => {
            if (this.status !== STATE_MAPPING.PENDING) {
                return;
            }
            this.status = STATE_MAPPING.REJECTED;
            this.value = val;
            this.onRejectedCallbacks.forEach(fn => fn());
        };

        try {
            exector(resolve, reject);
        } catch (error) {
            reject(error);
        }
    }

    init() {
        // 初始化状态pending
        this.status = STATE_MAPPING.PENDING;
        // promise 值
        this.value = undefined;
        // 成功回调集合
        this.onResolvedCallbacks = [];
        // 失败毁掉集合
        this.onRejectedCallbacks = [];
    }

    handleResolve(resolve, reject, handler) {
        try {
            const x = handler(this.value);
            if (x instanceof MyPromise) {
                x.then(resolve, reject);
            }
            else {
                resolve(x);
            }
        } catch (error) {
            reject(error);
        }
    }

    handleReject(resolve, reject, handler) {
        try {
            const x = handler(this.value);
            if (x instanceof MyPromise) {
                // 如果x是promise就会等待该 Promise对象的状态发生变化，才会被调用
                // 并且新的 Promise 状态和 x 的状态相同。
                x.then(resolve, reject);
            }
            else {
                // 否者将结果作为promise的值，传入下一个then中的回调函数
                resolve(x);
            }
        } catch (error) {
            reject(error);
        }
    }

    then(onFulfilled, onRejected) {
        //解决onFufilled,onRejected没有传值的问题
        onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v => v;
        onRejected = typeof onRejected === 'function' ? onRejected : err => {throw err};
        const actions = {
            // 当状态已经改变时，立即执行对应的回调函数
            resolved: () => {
                return new MyPromise((resolve, reject) => {
                    // 因为Promise本身是一个异步方法，属于微任务一列，必须得在执行栈执行完了在去取他的值
                    // 所以所有的返回值都得包一层异步setTimeout。
                    setTimeout(() => {
                        this.handleResolve(resolve, reject. onFulfilled);
                    }, 0);
                });
            },
            rejectd: () => {
                return new MyPromise((resolve, reject) => {
                    setTimeout(() => {
                        this.handleReject(resolve, reject. onRejected);
                    }, 0);
                });
            },
            // 当状态为pending，将回调函数插入执行队列中
            pending: () => {
                return new MyPromise((resolve, reject) => {
                    this.onResolvedCallbacks.push(() => {
                        setTimeout(() => {
                            this.handleResolve(resolve, reject, onFulfilled);
                        }, 0);
                    });
                    this.onRejectedCallbacks.push(() => {
                        setTimeout(() => {
                            this.handleReject(resolve, reject. onRejected);
                        }, 0);
                    })
                });
            }
        };

        // 根据当前状态执行对应函数
        return actions[this.status]();
    }
    catch(onRejected) {
        this.then(undefined, onRejected);
    }
    // 添加静态resolve方法
    static resolve(val) {
        return new MyPromise(resolve => resolve(val));
    }
    // 添加静态reject方法
    static reject(reason) {
        return new  MyPromise((resolve, reject) => reject(reason));
    }
    // 添加静态all方法
    static all(promises) {
        const arr = [];
        let i = 0;
        function processData(index, val, resolve) {
            arr[index] = val;
            i++;
            // 当所有promise 成功执行后，返回数组
            if (i === promises.length) {
                resolve(arr);
            }
        }
        return new MyPromise((resolve, reject) => {
            for (let index = 0; index < promises.length; index++) {
                const curPromise = promises[index];
                curPromise.then((res) => {
                    processData(index, res, resolve);
                }, err => {
                    // 如果有一项失败，则直接认为失败
                    reject(err);
                });
            }
        });

    }
    // 添加静态race方法
    static race (promises) {
        return new MyPromise((resolve, reject) => {
            for (let p of promises) {
                // 只要有一个实例率先改变状态，新的MyPromise的状态就跟着改变
                this.resolve(p).then(res => {
                    resolve(res)
                }, err => {
                    reject(err)
                })
            }
        });
    }
}