2021-07-21

自定义promise

(function (window) {
    const PENDING = 'pending'
    const RESOLVED = 'resolved'
    const REJECTED = 'rejected'

    function Promise(excutor) {
        const self = this;//promise的实例
        self.status = PENDING;
        self.data = undefined;
        self.callbacks = [];

        function resolve(value) {
            if (self.status !== PENDING) {
                return
            }
            self.status = RESOLVED;
            self.data = value;
            if (self.callbacks.length > 0) {
                setTimeout(() => {
                    self.callbacks.forEach(function (key) {
                        key.onResolved(value);
                    })
                })
            }
        }

        function reject(reason) {
            if (self.status !== PENDING) {
                return
            }
            self.status = REJECTED;
            self.data = reason;
            if (self.callbacks.length > 0) {
                setTimeout(() => {
                    self.callbacks.forEach(function (key) {
                        key.onRejected(reason);
                    })
                })
            }
        }

        try {
            excutor(resolve, reject)
        } catch (error) {
            reject(error)
        }
    }

    //指定异步回调
    Promise.prototype.then = function (onResolved, onRejected) {
        const that = this
        typeof onResolved === 'function' ? onResolved = onResolved : onResolved = (value) => value
        typeof onRejected === 'function' ? onRejected = onRejected : onRejected = (reason) => {
            throw reason
        }
        //返回一个新的Promise对象,该对象的状态由之前的Promise对象决定,这是new出来的,但self指向上一个实例对象
        return new Promise((resolve, reject) => {
            function handle(callback) {
                //  由于之前是成功状态,执行回调里就算有错误也要捕获,这样状态仍为成功
                try {
                    //result在成功的回调里相当于value,在失败的回调里相当于reason
                    const result = callback(that.data)
                    //如果是返回的是promise对象
                    if (result instanceof Promise) {
                        //要得到新的Promise的结果,只需要调用then方法
                        result.then(resolve, reject)
                        //    相当于:
                        //result.then(
                        // function(value){resolve(value)},
                        // function(reason){reject(reason)}
                        // )
                    } else {
                        //调用该函数,会再去调用onResolved里的函数
                        resolve(result)
                    }
                } catch (error) {
                    reject(error)
                }
            }

            //根据上一个Promise的状态决定执行下一步的回调
            if (that.status === RESOLVED) {
                setTimeout(() => {
                    handle(onResolved)
                })
            }
            if (that.status === REJECTED) {
                setTimeout(() => {
                    handle(onRejected)
                })
            } else if (that.status === PENDING) {
                that.callbacks.push({
                    //then上的onResolved和onRejected
                    //这种方式在最后会被调用,但是就算最后调用了也不会改变   return的promise   的状态,只能是调用而已,所以不能这样用
                    // onResolved, onRejected

                    onResolved(value) {
                        handle(onResolved)
                    }
                    ,
                    onRejected(reason) {
                        handle(onRejected)
                    }


                })
            }
        })

    }
    Promise.prototype.catch = function (onRejected) {
        return this.then(undefined, onRejected);
    }
    Promise.resolve = function (value) {
        return new Promise((resolve, reject) => {
            if (value instanceof Promise) {
                value.then(resolve, reject)
            } else {
                resolve(value)
            }
        })
        //  value可以是一个普通的值,也可以是一个promise对象
    }
    Promise.reject = function (reason) {
        return new Promise((resolve, reject) => {
            if (reason instanceof Promise) {
                reason.then(resolve, reject)
            } else {
                reject(reason)
            }
        })

    }
    Promise.all = function (promises) {
        let resolveCount = 0;
        const values = new Array(promises.length);
        return new Promise((resolve, reject) => {
            promises.forEach((key, index) => {
                key.then(
                    (value) => {
                        resolveCount++
                        values[index] = value;
                        if (resolveCount == promises.length) {
                            resolve(values)
                        }
                    }, reject
                )
            })

        })
    }
    Promise.race = function (promises) {
        return new Promise((resolve, reject) => {
            promises.forEach((key) => {
                key.then(
                    //    不用判断,第一个返回的key会自动决定结果
                    resolve, reject
                )
            })

        })
    }
    Promise.resolveDelay=function(value,time){
        return new Promise((resolve,reject)=>{
            setTimeout(()=>{
                if (value instanceof Promise) {
                    value.then(resolve, reject)
                } else {
                    resolve(value)
                }
            },time)
        })
    }
    Promise.rejectDelay=function(reason,time){
        return new Promise((resolve,reject)=>{
            setTimeout(()=>{
                if (reason instanceof Promise) {
                    reason.then(resolve, reject)
                } else {
                    reject(reason)
                }
            },time)
        })
    }
    window.Promise = Promise
})(window)
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值