Promises and its methods

What is promise ?

Promises were introduced to javascript in ES6. before promises we were using callbacks to manage asynchronous operations but while using them we may face the issue of callback hell and again code is also not properly readable so to recover these problems javascript introduced Promises.

Promises are used to handle asynchronous operations in JavaScript. They are easy to manage when dealing with multiple asynchronous operations. When creating a new promise, the promise constructor takes 2 arguments 'resolve' and 'reject'. resolve means fulfilling the promises. In other words, complete what you said you’re going to do. Reject means a promise is not fulfilled, in other words not completing what was set forth. let's see an example of the promise

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved');
  }, 5000);
});

Once promise gets resolved or rejected we can handle that promise using '.then' and '.catch'. lets see an example how we can handle promise using these methods

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved');
  }, 5000);
});

myPromise
     .then(res => console.log(res)) // Promise resolved
     .catch(error => console.log(error))

so if the promise gets resolved it will enter the '.then' block and will print the response or if the promise gets failed then it will automatically move to the '.catch' block and will print the error.

we can also do promise chaining to single promise which means by using multiple '.then ' methods on single promise we can create chain of them and handle response of that promise according to our requirements. lets see and example of promise chaining

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved');
  }, 5000);
});

myPromise
     .then(res => res + 'successfully')
     .then(response => console.log(response)) // Promise resolved successfully
     .catch(error => console.log(error))

as you see in the above example the output of the first '.then' block pass on to the next '.then' block which means the output of first '.then' block works as input of second '.then' block. In promise chaining no need to add '.catch' block after every '.then' block a single '.catch' block at the end will catch the error if any '.then. method fails

Methods in Promises

To handle promise more neatly we use promises methods. there are mainly 4 methods in promises they are as follows,

Promise.all()
Promise.allSettled()
Promise.any()
Promise.race()

Promise.all()

const myPromise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved 1');
  }, 5000);
});

const myPromise2 = new Promise((resolve, reject) => {
    resolve('Promise resolved 2');
});

const myPromise3 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved 3');
  }, 1000);
});

Promise.all([myPromise1 , myPromise2 , myPromise3 ]).then((result) => {
  console.log(result);
});

The Promise.all() method takes an array of promises as an input and returns a single Promise that gives us an array of the results. This returned promise will only resolve when all of the promises in the input array will get resolved, and if any promise from the input array gets rejected it will immediately give you an error

Promise.allSettled()

const myPromise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved 1');
  }, 5000);
});

const myPromise2 = new Promise((resolve, reject) => {
    resolve('Promise resolved 2');
});

const myPromise3 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved 3');
  }, 1000);
});

Promise.allSettled([myPromise1 , myPromise2 , myPromise3 ]).then((result) => {
  console.log(result);
});

The Promise.allSettled() method takes an array of promises as an input and returns a single Promise that gives us an array that contains the status and value of each promise. This returned promise will only resolve when all of the promises in the input array will get resolved, and if any promise from the input array gets rejected it will give you the output but in that, it will mention the status of that rejected promise as rejected and the reason of rejection

Promise.any()

const myPromise1 = new Promise((resolve, reject) => {
    reject('Promise resolved 1');
});

const myPromise2 = new Promise((resolve, reject) => {
    resolve('Promise resolved 2');
});

const myPromise3 = new Promise((resolve, reject) => {
    resolve('Promise resolved 3');
});

Promise.any([myPromise1 , myPromise2 , myPromise3 ]).then((result) => {
  console.log(result);  //  Promise resolved 2
});

The Promise.any() method takes an array of promises as an input and returns a single Promise that gives us any first Promise which gets resolved and if all promise gets rejected it will give an error with message "All promises were rejected"

Promise.race()

const myPromise1 = new Promise((resolve, reject) => {
    resolve('Promise resolved 1');
});

const myPromise2 = new Promise((resolve, reject) => {
    reject('Promise resolved 2');
});

const myPromise3 = new Promise((resolve, reject) => {
    resolve('Promise resolved 3');
});

Promise.race([myPromise1 , myPromise2 , myPromise3 ]).then((result) => {
  console.log(result);  //  Promise resolved 1
});

The Promise.race() method takes an array of promises as an input and returns a single Promise that gives us any first Promise which gets resolved and if it encountered with any rejected Promise before resolved promise it will give an error.

So, that's it for today. in this blog we saw how the promise and its methods make our life easier. I hope you enjoyed it

will meet in the next blog 😉

until then bbye Thank You!

lomesshh