자체 제작promise

1406 단어

기본 원리


1. 구조 방법을 통해 하나의 프로미스 대상을 생성하지만 구조 방법에 전달된 방법은 즉시 호출되지 않습니다.then을 통해promise 대상의 성공 방법 목록에 방법을 추가하고,catch를 통해promise의 실패 방법 목록에 방법을 추가합니다.초기 상태가 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()
})

좋은 웹페이지 즐겨찾기