当前位置:网站首页>Handwriting promise [02] - asynchronous logic implementation

Handwriting promise [02] - asynchronous logic implementation

2022-06-11 06:22:00 Geek student

Last handwritten Promise No asynchronous processing , This article implements .

1. Last implemented Promise

const PENDING = 'pending';
const FULFILLED = 'fulfilled';
const REJECTED = 'rejected';

class LyPromise {
    
    constructor(executor) {
    
        executor(this.resolve, this.reject)
    }

    status = PENDING;

    value = undefined;
    reason = undefined;


    resolve = (value) => {
    
        if (this.status !== PENDING) return;
        this.status = FULFILLED;

        this.value = value;

    }

    reject = (reason) => {
    
        if (this.status !== PENDING) return;
        this.status = REJECTED;
        this.reason = reason;

    }

    then(successCallback, failCallback) {
    
        if (this.status === FULFILLED) {
    
            successCallback(this.value);
        } else if (this.status === REJECTED) {
    
            failCallback(this.reason)
        }
    }
}

module.exports = LyPromise;

2. Calling LyPromise Add an asynchronous code


const LyPromise = require('./LyPromise')

let promise = new LyPromise((resolve, reject) => {
    
    setTimeout(() => {
    
        resolve(' success ');
        // reject(" Failure ");

    }, 2000)
})

promise.then(value => {
    
    console.log(value)
}, reason => {
    
    console.log(reason);
})

analysis :

  • In order from top to bottom , stay new One LyPromise after , The callback function in it will execute immediately .
  • Encountered in the process of execution setTimeout An asynchronous function , Delay 2s Execute the logic inside .
  • promise.then Callbacks in are immediate , here then Method execution , Judge the current state . But at this time status It's still PENDING. We are LyPromise Defined then The method is not right PENDING The judgment of the , Need to be supplemented .
const PENDING = 'pending';
const FULFILLED = 'fulfilled';
const REJECTED = 'rejected';

class LyPromise {
    
    constructor(executor) {
    
        executor(this.resolve, this.reject)
    }

    status = PENDING;

    value = undefined;
    reason = undefined;

    successCallback = undefined;
    failCallback = undefined;
    // If there is an asynchronous operation in the actuator , Such as ajax, Timer task time ,then Function status Or waiting ,
    // At this point, you do not know whether to execute a success or failure callback , in other words resolve and reject Will be waiting to be executed ,
    // So all you need to do is resolve and reject Determine whether there are any success or failure callbacks stored by us , Just do it again 

    resolve = (value) => {
    
        if (this.status !== PENDING) return;
        this.status = FULFILLED;
        this.value = value;
        //  Determine whether a successful callback exists , If there is   Call the successful callback 
        this.successCallback && this.successCallback(this.value);

    }

    reject = (reason) => {
    
        if (this.status !== PENDING) return;
        this.status = REJECTED;
        this.reason = reason;
        //  Determine whether the failed callback exists , If there is   Call the failed callback 
        this.failCallback && this.failCallback(this.reason)

    }

    then(successCallback, failCallback) {
    
        if (this.status === FULFILLED) {
    
            successCallback(this.value);
        } else if (this.status === REJECTED) {
    
            failCallback(this.reason)
        } else {
    
            //  When the actuator operates asynchronously ,status still pending,
            //  So at this time, we don't know whether it is a success or a failure callback , So here we need to call back these two 
            //  Store it 
            this.successCallback = successCallback;
            this.failCallback = failCallback;
        }
    }
}

module.exports = LyPromise;

complete .

原网站

版权声明
本文为[Geek student]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/03/202203020527521037.html