Brief Analysis of promise and Custom promise

Keywords: Javascript supervisor less

Briefly introduce the usage of promise. I think if someone would like to read this article, they will know more or less about the usage of promise.

 new Promise((res, rej) => {
        try{
            //Execute function;
            res(data)
        } catch(e){
            rej(e);
        }}).then(resCb, rejCb).then(cb);

On a whim, I went to try writing promise for myself today.Let me start with my personal understanding of promise

1.promise is expressed as throwing data from the return value of the executed function through resolve or reject, and then processing data in the then function
2.promise can call then in a chain, with the return value of the previous then as an argument to the function in the next then

In fact, promise s are not necessarily executed within the then, especially when asynchronous, and should be executed in the instance function to fit our understanding of single threading.

promise's simple point theory is divided into two parts.One is the execution function passed in at the time of instantiation, and the other is the callback function passed in at the time, which is like an invigilator between a teacher and a student
If the supervisory teacher arrives in the classroom first, it is natural that the students enter the classroom directly in turn; (The instance function executes faster than the statement of the then)
If the supervisory teacher arrives behind the students, the students can only queue up in order to wait for the supervisory teacher at the door; (The instance function executes slowly)
That is, the order in which the declarations of the function and the function are executed is not fixed (in general, the declaration is completed first)
A status code is needed to determine what the situation is ('default','resolve','reject').
For ease of understanding, consider resolve and reject the same type
I'll just send the code and comment first
Time is limited, this time we will not consider the asynchronous function in the

// Briefly describe the following logic:
    //1. Define a state to determine which of the functions passed in at the time of the instantiation is completed first
    //That is what we just said about supervisory teachers and students.The default value is default and the default teacher is not there (the instance function is not completed)
    //2. Define resolve_to store the method defined in the then, which is equivalent to a student queued aisle for easy sequential execution. reject_is the same. The following is no longer repeated
    //3. Define the resolveData used to record the thrown value, which is the data in res(data), as a parameter to the method in the
    //4. When res throws a value, changing state to resolve is equivalent to indicating that the supervisor is in the classroom
      //If there are already defined functions in the resolve_queue, they are executed in turn, which is equivalent to entering the classroom if there are students.
    //5. When the method declares, is the state of detection default, and if so, does it not throw a value?
      //Equivalent to invigilator teachers have not yet arrived, students are queued to join the resolve_queue; 
      //If the status is no longer default, then the supervisory teacher has arrived and the students do not have to queue up to enter the classroom directly; that is, the method is executed directly
  
new promise_( (res, rej) => res(3)).then(data=> {console.log(data);return 6}).then(data => console.log(data))// 3,6

For a real example
The example above clearly shows that res(3) executes first, then executes the function of the
Equivalent to the invigilator arriving in the classroom first, then the function defined in the then should be executed directly

new promise_( (res, rej) => setTimeout( () => res(3), 1000).then(data=> {console.log(data);return 6}).then(data => console.log(data))// 3,6

The example above clearly shows that the definition is completed before the res throws a value
Equivalent to an invigilator arriving in the classroom, then the function defined in the then should be queued silently

Because the order of the then and instance functions is not certain, the state is used to determine whether the instance function is completed.
Also, when the instance function finishes throwing a value, it needs to check the resolve_queue to see if the n has been declared complete.

class promise_ {

    constructor(func) {

        if(typeof func !== 'function'){
            throw Error('Parameter must be a function in instantiation');
            return;
        } // Judging whether or not a function is passed in is not logical, just look down

        this.state = 'default'; //Used for judgment
        this.resolve_ = []; // Method queue in the then to receive the resolve method
        this.reject_ = []; // Reject method queue in the then to receive reject methods
        this.resolveData = null; // Thrown value of resolve
        this.rejectData = null; // Thrown value of reject 

        func(this.resolve.bind(this), this.reject.bind(this)); //Functions passed in when instantiating

    }
    
    then(cb, errCb) {

        if(typeof cb !== 'function' || (errCb && typeof cb !== 'function')) {
            throw Error('then Parameters, Successful Callback Function, Failed Callback Function');
            return;
        } // Is everyday judgment correct and not related to logic?

        switch(this.state) { // Check whether the supervisory teacher is in the classroom
            case 'default': this.resolve_.push(cb); this.reject_.push(errCb); break;// Queue up if the supervisor is not present
            case 'resolve': this.resolveData = cb(this.resolveData); break; // If the supervisor is present, come in directly. Because of the chain call, change the thrown value after execution to make it easier for the later one to use
            case 'reject': this.rejectData = errCb(this.rejectData); break;// If the supervisor is present, come in directly. Because of the chain call, change the thrown value after execution to make it easier for the later one to use
            default: break; 
        }

        return this; // call chaining
    }

    resolve(data) {

        if(!data) return; // Logically independent of whether there are parameters or not

        this.resolveData = data; // Set Throw Value
        this.state = 'resolve'; // Setting the status to resolve indicates that the supervisor is present
        while(this.resolve_.length)  // First in, first out, then function in then
            this.resolvedata = this.resolve_.shift()(data);
    }

    reject(data) {

        if(!data) return;

        this.rejectData = data;
        this.state = 'reject';
        while(this.reject_.length) 
            this.rejectData = this.reject_.shift()(data);
    }

}


Posted by ajmoore on Thu, 27 Jun 2019 10:00:44 -0700