10.PromiseAll方法模拟

32 阅读1分钟
// PromiseAll方法模拟

// 原PromiseAll演示
function p1 () {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('p1')
        }, 2000)
    })
}

function p2 () {
    return new Promise((resolve, reject) => {
        resolve('p2')
    })
}

Promise.all(['a', 'b', p1(), p2(), 'c'])
    .then(value => {
        // console.log(value) // [ 'a', 'b', 'p1', 'p2', 'c' ]
    })


// 模拟实现
const PENDING = 'pending'
const FUFILLED = 'fulfilled'
const REJECTED = 'rejected'

class MyPromise {
    constructor (executor) {
        try {
            executor(this.resolve, this.reject)
        } catch (error) {
            this.reject(error)
        }
    }
    status = PENDING
    value = undefined
    reason = undefined
    successCallback = []
    failCallback = []

    resolve = value => {
        if (this.status !== PENDING) return
        this.status = FUFILLED
        this.value = value
        while(this.successCallback.length) this.successCallback.shift()()
    }
    reject = reason => {
        if (this.status !== PENDING) return
        this.status = REJECTED
        this.reason = reason
        while(this.failCallback.length) this.failCallback.shift()()
    }
    then(successCallback, failCallback) {
        successCallback = successCallback || (value => value)
        failCallback = failCallback || (reason => { throw reason })
        const promise2 = new MyPromise((resolve, reject) => {
            if (this.status === FUFILLED) {
                setTimeout(() => {
                    try {
                        const successValue = successCallback(this.value)
                        resolvePromise(promise2, successValue, resolve, reject)
                    } catch (error) {
                        reject(error)
                    }
                }, 0)
            } else if (this.status === REJECTED) {
                setTimeout(() => {
                    try {
                        const failReason = failCallback(this.reason)
                        resolvePromise(promise2, failReason, resolve, reject)
                    } catch (error) {
                        reject(error)
                    }
                }, 0)
            } else {
                this.successCallback.push(() => {
                    setTimeout(() => {
                        try {
                            const successValue = successCallback(this.value)
                            resolvePromise(promise2, successValue, resolve, reject)
                        } catch (error) {
                            reject(error)
                        }
                    }, 0)
                })
                this.failCallback.push(() => {
                    setTimeout(() => {
                        try {
                            const failReason = failCallback(this.reason)
                            resolvePromise(promise2, failReason, resolve, reject)
                        } catch (error) {
                            reject(error)
                        }
                    }, 0)
                })
            }
        })
        return promise2
    }
    static all (array) {
        // 存储需要处理的内容
        const results = []
        let i = 0
        // 返回一个Promise
        return new MyPromise((resolve, reject) => {
            function addData (key, value) {
                // 按照顺序处理返回结果
                results[key] = value
                i++
                // 处理存在异步的情况,需要所有内容处理完成之后才返回promise的处理结果
                if (i === array.length) {
                    resolve(results)
                }
            }
            array.forEach((value, index) => {
                if (value instanceof MyPromise) {
                    // 成功回调结果存储起来,失败结果直接整个处理成失败
                    value.then(value => addData(index, value), reason => reject(reason))
                } else {
                    addData(index, value)
                }
            })
        })
    }
}
function resolvePromise(promise2, resValue, resolve, reject) {
    if (resValue === promise2) {
        return reject(new TypeError('Chaining cycle detected for promise #<Promise>'))
    }
    if (resValue instanceof MyPromise) {
        resValue.then(value => resolve(value), reason => reject(reason))
    } else {
        resolve(resValue)
    }
}

// 验证
function a1 () {
    return new MyPromise((resolve, reject) => {
        setTimeout(() => {
            resolve('a1')
        }, 2000)
    })
}

function a2 () {
    return new MyPromise((resolve, reject) => {
        resolve('a2')
    })
}
MyPromise.all(['a', 'b', a1(), a2(), 'c'])
    .then(value => console.log(value), reason => console.log(reason))