To take a real-world example, consider a promise you make to your friend to help him/ her out with their work. While your friend has an assurance that you might help them out in the future, there are 3 possibilities of action-
- Pending- Your friend is unsure if you will help out or not
- Fulfilled- You kept your promise and helped out your friend
- Rejected- You don’t help out your friend
- Pending- When the asynchronous operation is underway and the outcome of the promise is uncertain
- Fulfilled- When the asynchronous operation is complete and the promise receives a value
- Rejected- When the asynchronous operation has failed and the promise will never receive a value.
For all developers out there, the promise seems to be a way out of the ‘callback hell’ most experience at some point or the other. In a nutshell, the switch to promise is a result of its ability to deliver a cleaner, neater syntax with an effective methodology to handle asynchronous operations and make them look synchronous.
Understanding how Promises work
To understand how promises work, it is important to understand that a promise consists of 2 parts- One which creates the promise and defines the conditions of success or failure. The other describes the next steps when the condition succeeds or fails.
Creating a Promise
A promise object is generally created a new keyword using what is known as an ‘executor function’ based on 2 parameters. Resolve or the first function results when the asynchronous operation is successful and returns the result as a value. The second function or reject results when the operation has failed along with a reason for the failure, generally displaying the error.
It is quite normal to need multiple promises in a single asynchronous operation. This can be achieved by using what developers are referring to as chaining of js promise. The process is relatively simple to understand. You can just chain the .then () function of the first promise returning the next promise and so forth.
Chaining of promises raises the question of sequential vs simultaneous execution. Promise.all() and Promise.race() can be adopted respectively. The former command evaluates all promises and only executes the .then() method when all promises have finished. The latter, on the other hand, starts executing the .then() method as soon as one promise has completed execution.
As mentioned, the execution function then() is based on two callbacks- resolve and return. Using another function catch() can make your life easier. In case the promise is rejected, the catch() function can be used to handle the promise rejection and resolve the error. This function not only makes asynchronous callback frictionless but also makes handling errors a piece of cake.
To understand what makes JS promise an appealing object to adopt, let’s look at a list of advantages it offers-
A clean code
Promise requires a significantly less amount of code for the effective asynchronous operation. As opposed to the traditional callback function, the coding for promises is far more clean and concise. The benefits are two-pronged. Firstly, the developers have to write much less code, saving them a lot of time. Secondly, the developers can easily avoid nesting of the code. Additionally, the composition becomes easier. Promise allows developers to reuse many synchronous tools. Thus, using promise allows users to save time and a decent amount of code.
Better readability and visualization
Resulting from its ability to create clean and concise codes, js promise also ensures the creation of a legible code. Since the code is shorter, it is easily readable. Additionally, it caters to better visualization of the execution flow. This allows developers to move from callback hell to a happy chaining land.
Finally, promise makes the handling of rejection of an asynchronous operation a lot easier. Firstly, it provides a unified platform to deal with problems of both asynchronous errors and normal exceptions. This prevents time and energy wastage in dealing with multiple platforms. Secondly, promise allows developers to chain then() and catch() function to not only get notified about rejection but to also understand the underlying error.
The Final Word