SoFunction
Updated on 2025-03-03

The JavaScript interview must-have exam to implement handwritten promise

Promise handwriting

As a must-have question for interviews, the handwriting of Promise is also a must-ask question for interviewers, so we must understand Promise thoroughly.

frame

(function(window) {
    
     = function (onResolved, onRejected) {}
     = function (onRejected) {}
    
    function MyPromise(executor){

        function resolve(value){}

        function reject(error){}

        try{
            executor(resolve, reject)
        }catch(error){
            reject(error)
        }
    }

     = MyPromise
}(window))

Complete code

    (function (window) {
        //mount the .then and .catch methods on the MyPromise prototype         = function (onResolved, onRejected) {//.then accepts two callback functions, resolved state and rejected state
            // .then returns a promise object            return new MyPromise((resolve, reject) => {
                let self = this;

                if ( === 'pending') {//If MyPromise status is pending, push the two callback functions into the callback array and wait
                    ({ onResolved, onRejected })

                } else if ( === 'resolved') {  //If MyPromise status is resolved, call onResolved directly                    setTimeout(() => {
                        //Check whether the callback in .then returns the return value                        const result = onResolved()

                        //If there is no return return value, the default return promise object is returned                        if (result instanceof MyPromise) {
                            ((res => resolve(res), err => reject(err)))
                            return result
                        } else {
                            resolve(result)
                        }
                    })
                } else {

                    setTimeout(() => {
                        onResolved()
                    })
                }
            })

        }
         = function (onRejected) { //.catch accepts a callback function
            if ( === 'pending') {
                // Put the callback function into the callbacks array                ({ onRejected })
            } else if ( === 'rejected') {
                setTimeout(() => {
                    onRejected()
                })

            }
        }

        // MyPromise constructor accepts an execution function        function MyPromise(executor) {
            const self = this;
             = undefined;
             = []
            //Set the initial state of the promise object to pending             = 'pending'
            //The first parameter of the execution function is the resolve callback            function resolve(value) {
                //If the status is not pending, return directly                if ( !== 'pending') {
                    return
                }

                // Execute resolve and change the state of the promise object                 = 'resolved';

                // Get the value in resolve                 = value;

                // Call the callback function in callbacks                if ( > 0) {
                    setTimeout(() => {
                        (callbacksObj => {
                            (value)
                        });
                    })
                }
            }

            // The second parameter of the execution function is the rejecr callback            function reject(error) {
                //If the status is not pending, return directly                if ( !== 'pending') {
                    return
                }

                // Execute resolve and change the state of the promise object                 = 'rejected';

                // Get the value in resolve                 = error;

                // Call the callback function in callbacks                if ( > 0) {
                    setTimeout(() => {
                        (callbacksObj => {
                            (value)
                        });
                    })
                }
            }
            //Catch errors using try catch            try {
                // Execute the function within the try                executor(resolve, reject)
            } catch (error) {
                // If an error occurs, reject is executed by default                reject(error);
            }

        }

         = MyPromise
    }(window))

test

resolve

    let MyPromiseTest = new MyPromise((resolve, reject) => {
        resolve('resolve')
    })
    (res => {
        (res);
    })
    
    //   resolve
    let MyPromiseTest = new MyPromise((resolve, reject) => {
        resolve('resolve');
    })
    (res => {
        (res);

    })
        .then(res => {
            ('I am.then()The one behind.then()');
        })
        
    //   resolve
    // I'm the .then() after .then()

reject

    let MyPromiseTest = new MyPromise((resolve, reject) => {
        reject('reject')
    })
    (err => {
        (err);
    })
    
    //   reject
    let MyPromiseTest = new MyPromise((resolve, reject) => {
        (a);
    })
    (err => {
        ('Catch error' + ':' + err);
    })
    
    //   Catch errors:ReferenceError: a is not defined

This is the article about the JavaScript interview that requires the implementation of handwritten Promise. This is the end of this article. For more related JavaScript handwritten Promise content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!