This blog is dedicated to JAVASCRIPT PROMISE and various terms related to it in a very simple and basic language aiding to the needs of a beginner in the world of coding . I'll be providing some links at the end if you wish to study this topic further with more examples to refer to. So, let's hop in !!!

JS PROMISE

Promise is an object which handles the success/failure of an Asynchronous Operation.

An Asynchronous operation is the process which takes unknown amount of time to get completed and return a result. What we do (in the case of promise) is, create algorithms that should be executed if the async operation succeeds/fails in the future. This helps in making the async process behave as a synchronous one. It doesn't return a value immediately like a sync process but it promises to provide a value at one point or the other.

Another feature of Promise is that it can very well avoid the callback hell.

What IS a Callback hell???

Callback is simply when a function X is passed as a parameter to another function Y. Function Y can callback function X at any point of time : it might be synchronous i.e. immediate or asynchronous (with a delay). When there are multiple such nested functions, out of which some might be async functions, it becomes a callback hell since the code becomes unreadable and there is too much delay caused by the async processes. Once a function starts delaying the process, you cannot go to the next step, neither can u move to the previous one. Callback Hell makes the readability of code difficult and the process execution is delayed. All these problems can be solved by PROMISE upto a certain extent.

Basic Syntax

Creating a new promise using Promise constructor :

As you can see, the Promise constructor takes in only 1 argument which is an anonymous function with 2 parameters :

1. resolve : Resolve is the function called when the process is successful. It may/may not contain some further action (like print a statement) to be taken.
2. reject : Reject function call indicates error(s) occurred during the process.

3 states of a Promise :

1. pending : When there is no resolve/reject yet.
2. fulfilled : Operation is successful. Resolve is called.
3. rejected : As the name suggests, the operation is unsuccessful and returns an error.

.then()

This method is invoked as soon as the promise is either rejected or resolved. It takes data from the promise and processes it further(in some cases).

Above is the basic structure of the then method. It takes in 2 parameters (can be absent as well) :

• onFulfilled : This function is called if the promise is resolved. If it doesn't have a value of its own, then it returns back the argument passed on to the resolve method as the final value.

• onRejected : Function called if the promise is rejected. This can take in 1 argument as well in the absence of which , the value from the reject method is finalised.

Let's check out an example :

In the above example :

• myPromise is a new Promise object created which has an anonymous function as a parameter which itself has 2 parameters : resolve and reject.

• If the value of x is TRUE, then the resolve method will be invoked which takes in an argument "Successful" otherwise the reject method will be invoked which takes in an argument "Error".

• When the reject/resolve has been decided , then method is executed which takes in 2 functions as its parameters for the resolve and reject outcomes respectively.

• Here, if the process is resolved, the argument passed to resolve method i.e. "Successful" will be passed to the first function and the output will be "Successful" otherwise the reason function is executed displaying "Error" at the end.

.catch() method

.catch() is a better way to handle a rejected promise. Instead of passing the value to one of the functions in a .then method, we define a .catch() method at the end of all the .then() methods (Yes, you can have as many .then() as you wish according to the scenario). It is similar to the .then() method during a rejection case but defined separately.

This is how the Promise object basically works and tries to prevent a callback hell. It makes the code readable and manageable as well. Instead of nesting too many callback processes, you can simply work with .then() and .catch().

For further understanding , you can refer to the below links : developer.mozilla.org/en-US/docs/Web/JavaSc..

geeksforgeeks.org/javascript-promises/?ref=..

I hope the article provided you all some insight into this topic.

If you wish to discuss upon some topic, connect with me on my twitter account : @TaNiSi119

Keep Learning and Keep smiling☺️!! Ciao!! 👋