自建promise

基本原理

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)