美文网首页
自建promise

自建promise

作者: Cc极生 | 来源:发表于2019-03-15 15:27 被阅读0次

    基本原理

    1.通过构造方法生成一个promise对象,但是构造方法中传入的方法不会立即调用
    2.通过then给promise对象中的成功方法列表中添加方法,通过catch给promise中的失败方法列表添加方法
    3.初始状态为pending,且变为fulfilled或rejected后不会再被改变
    4.在添加完所有方法后执行构造函数中添加的方法,仅有构造函数中传入的方法可以修改promise的执行状态,后续then中添加的方法不会有resolve,reject的传参

    class PromiseA {
        constructor(asyncFunc) {
            this.handlerList = []
            this.catchList = []
            this.state = 'pending'
            setTimeout(() => {
                asyncFunc(this.resolve.bind(this),this.reject.bind(this))
            });
            return this
        }
    
        resolve() {
            if (this.state !== 'pending') { // 保证promise状态在改变后不会再被修改
                return
            } 
            this.state = 'fulfilled'
            this.handlerList.forEach(element => { // 依次运行所有注册在成功调用方法列表中的方法
                element()
            });
        }
    
        reject(err) {
            if (this.state !== 'pending') { // 保证promise状态在改变后不会再被修改
            return
            } 
            this.state = 'rejected'
            this.catchList.forEach(element => { // 依次运行所有注册在错误捕获方法列表中的方法
                element(err)
            })
        }
    
        then(asyncFunc) {
            this.handlerList.push(asyncFunc)
            return this
        }
    
        catch(errFunc) {
            this.catchList.push(errFunc) 
        }
    }
    
    new PromiseA((resolve, reject) => {
        setTimeout(() => resolve(), 3000)
        // reject('123')
        reject()
    })
    

    相关文章

      网友评论

          本文标题:自建promise

          本文链接:https://www.haomeiwen.com/subject/wotrmqtx.html