Promise advanced in JavaScript

Tram Ho

Today we will talk about Promise . In javascript we have worked with it a lot, for example when we manipulated the API or when we wanted to create an asynchronous handler. Promise is a concept that is neither easy to understand nor difficult to understand. But depending on our level of understanding it will give us more choice in handling situations in javascript. Today let’s learn about a way to manage multiple Promise or asynchronous handling. In this article we will combine the use of class and Promise .

class and Promise in javascript

1.1 Class

The class concept introduced in the standard ES6 of javascript is based on the inheritance of prototypal inheritance in javascript. Basically prototypal inheritance refers to the ability to access properties of object A from another object B (we will look at this in another article).

In fact, the class is a special function and when we call that function with the keyword new we will get an instance of an object that the class has defined. And when initialized with the keyword new , the constructor method in that class will be called (here we can take the input parameter and use it in the class).

In today’s article we will use class to store variables used to manage multiple Promise .

1.2 Promise

The Promise concept is too familiar to us. Promise represents an asynchronous process (processor needs to wait a large / small amount of time to complete).

When initiating a Promise it will need to be input with a callback function. This function will take two input parameters, resolve and reject . These two parameters will allow us to decide Promise that we will successfully initialize returns data ( resolve ) or will fail and return an error code ( reject ).

A Promise that is launched can have one of the three states, pending , fulfilled , rejected . pending is the finished pending state, which is the initial state of a Promise . fulfilled is the successful processing state, it indicates that the Promise processing succeeded (using resolve to change the Promise back to this state). Finally, rejected is the failed handling state, which indicates that the Promise treatment was failed (using reject to convert the Promise back to this state).

A Promise when running will only be successful or failed (except for the initial pending state). After successful or failed processing it will return the corresponding data on success and error code on failure. We can use .then to manipulate the corresponding success data and .catch to manipulate the returned error code data.

Another way we can easily return a successful or failed Promise with the corresponding success or failure data or error code. Promise.prototype.resolve and Promise.prototype.reject will return a successful Promise instance or a failed Promise instance in turn. It helps us to be more flexible in how to handle the situation, not depending too much on the handling.

Next, let’s try to combine the two above concepts to handle the problem of managing multiple Promise .

2. Combine class and Promise

Our goal first will be to manage multiple asynchronous handlers that allow error handling for these multiple threads. When an error handler occurs we will pause the subsequent error handlers and run another intermediate handler (for debugging) and until the handler is successful we will start running the other handlers again. error handling was paused earlier and ended a thread.

The real situation where we can apply is the handling of refresh session authen upon expiration. Next to the code we will manipulate:

With the above code, we can temporarily handle according to the original requirements. Problems will arise around but will be insignificant.

In the above code, we will need to note a core point for the smoothest management of Promise . It is the handle that pauses the error handling when there was a previous error handling and calls back the paused error handling. Here we will use the method that except for the first error handling, the following error handling will be generated corresponding to a Promise instance. These Promise instances will do the job of storing the two callback resolve and reject handlers in the queue and will always be pending during the middle of the processing call when the result comes in (since we don’t calls resolve or reject right after that, which will only run when the executeQueue method is called).

It’s interesting, isn’t it, somehow we have halted processing and can even manipulate those threads right after the debug intermediate processing has got results.

3. Conclusion

So I have completed the combination of class and Promise used to manage and manipulate asynchronous processing or Promise . This combination relies heavily on the Promise concept as well as the Promise state, partly that our variables are synchronized in a class instance. Maybe next time try to combine Closures and Promise see stars.

My article is over here. Hopefully it will bring benefits to you and have interesting solutions to Promise . See you in the next article. Hello!

Share the news now

Source : Viblo