Promise and Promise chain in Javascript

Promise and Promise chain in Javascript

A promise represents the completion stage of an asynchronous operation.

We use promises to figure out whether the asynchronous operation is completed or not.

There are 3 potential stages in a promise that can be

  1. Pending stage: This is the initial stage of the promise, this is the first stage of any promise based on its outcome, it will eventually go to fulfilled stage or rejected stage.

  2. Fulfilled stage: If the promise is completed or resolved then it is the fulfilled stage.

  3. Rejected stage: If the promise is rejected then it is in rejected stage.

Syntax of Promises:

Promise Object takes an anonymous function which has two methods ⇒ resolve and reject

  1. If the promise is successful resolve is called

  2. If the promise went wrong rejection is called

const count =true;
let countValue = new Promise(function(resolve,reject){
    if(count){
        resolve("Promise Fulfilled")
    }
    else{
        reject("Promise Rejected")
    }
})

console.log(countValue)

In the above example as the count is true then resolve is called, if the count is false then the promise is rejected.

The above example is always successful or went wrong based on the boolean value of the count.

Lets us take another example,

let promiseState = new Promise(function(resolve,reject){
    setTimeout(()=>{
        resolve('Done')
    },1000)
})
console.log(promiseState)
promiseState.then((success)=>{console.log(success)}).catch((error)=>{
    console.log(error)
}).finally(()=>{
    console.log("execute")
})

But, in our daily use case we use promises for getting the data from our database or fetching the data from an API, for those we can’t say the state of the promise, it can be successful or went wrong.

In the above example you can see that we are using setTimout ⇒ Here it will execute the callback function after 1 second or 1000 milliseconds.

Initially promise is pending for 1 second based on the resolve or rejection it can be successful or failure. we handle those here in a promise chain.

From the above example, we can see that the promiseState object has three methods

  1. then: this is executed when the promise is resolved or successful

  2. catch: this is executed when the promise is rejected

  3. finally: Irrespective of the promise state at the end this is executed.

If your promise has chaining means waiting and getting the another response using then, then, then ..etc.

If anything is rejected you can handle that with one catch like below

promiseState.then((success)=>{
    console.log(success)
}).then(()=>{
    console.log(success)
}).then(()=>{
    console.log(success)
}).then(()=>{
    console.log(success)
}).catch((error)=>{
    console.log(error)
}).finally(()=>{
    console.log("execute")
})

suppose if we get any error at the 2nd then with one catch we can handle that instead of writing catch for every then.

Did you find this article valuable?

Support Mahidhar Kakumani by becoming a sponsor. Any amount is appreciated!