其他分享
首页 > 其他分享> > 自定义promise

自定义promise

作者:互联网

class Promise {
    resolve(data) {
        if (this.PromiseState === 'rejected') return
        this.PromiseState = 'fulfilled'
        this.PromiseResult = data
        // 执行保存的回调
        const fulfills = this.callbacks.fulfilled
        for (let i = 0; i < fulfills.length; i++) {
            this.executeCallback(fulfills.shift(), [this.PromiseResult], 'fulfilled')
        }
        return this
    }

    reject(data) {
        if (this.PromiseState === 'fulfilled') return
        this.PromiseState = 'rejected'
        this.PromiseResult = data
        // 执行保存的回调
        const rejects = this.callbacks.rejected
        for (let i = 0; i < rejects.length; i++) {
            this.executeCallback(rejects.shift(), [this.PromiseResult], 'fulfilled')
        }
        return this
    }

    constructor(executor) {
        if (typeof(executor) !== 'function'){
            throw TypeError(`Promise resolver ${executor} is not a function`)
        }
        this.PromiseState = 'pending'
        this.PromiseResult = undefined

        // 保存异步修改状态时的回调函数
        this.callbacks = {fulfilled: [], rejected: []}
        // 绑定函数在外部执行时的this指向
        let resolve = this.resolve.bind(this)
        let reject = this.reject.bind(this)
        this.executeCallback(executor, [resolve, reject], 'pending')
    }

    then(onResolved, onRejected) {
        if (typeof(onResolved) !== 'function' || typeof(onRejected) !== 'function'){
            return this
        }
        if (this.PromiseState === 'fulfilled' ) {
            this.executeCallback(onResolved, [this.PromiseResult], this.PromiseState)
        }
        if (this.PromiseState === 'rejected') {
            this.executeCallback(onRejected, [this.PromiseResult], this.PromiseState)
        }
        if (this.PromiseState === 'pending') {
            this.callbacks.fulfilled.push(onResolved)
            this.callbacks.rejected.push(onRejected)
        }
        return this
    }
    catch(onRejected){
        if (this.PromiseState === 'pending') {
            this.callbacks.fulfilled.push(onResolved)
            this.callbacks.rejected.push(onRejected)
        }
        if (this.PromiseState === 'rejected') {
            this.executeCallback(onRejected, [this.PromiseResult], this.PromiseState)
        }
        return this
    }

    executeCallback(func, arg, state) {
        if (state === 'pending') {
            try {
                func(...arg)
            } catch (e) {
                this.reject(e)
            }
        }
        if (state === 'fulfilled' || state === 'rejected') {
            try {
                const rest = func(...arg)
                // 如果返回的是一个promise则让this里面的属性改为新的promise对象
                // 如果返回的是非promise对象则直接执行resolve
                if (rest instanceof Promise) {
                    this.PromiseState = rest.PromiseState
                    this.PromiseResult = rest.PromiseResult
                    this.callbacks = rest.callbacks
                } else {
                    this.resolve(rest)
                }
            } catch (e) {
                // 先改状态为pending才能执行reject
                this.PromiseState = 'pending'
                this.reject(e)
            }
        }
    }
}


(function init(window) {
    window.Promise = Promise
}(window))

标签:PromiseResult,自定义,rejected,fulfilled,callbacks,PromiseState,promise,executeCallb
来源: https://www.cnblogs.com/xiasir/p/15112380.html