Promise in JavaScript (with All the Methods)

Shraddha Paghdar
JavaScript in Plain English
4 min readMay 27, 2021

--

Promise in javascript

A promise is an object which either gives you a result or error in the future as soon as it completes the task. It is a popular design pattern used to handle asynchronous tasks in Node.js. It can take care of parallel/serial execution of many tasks along with their chaining rules. The promise structure also provides effective error-catching mechanisms.

Promise.resolve():

The Promise.resolve() method returns a resolved Promise object with a given value. Depending upon a resolved promise value, it

1. returns promise if fulfilled with promise
2. returns a value if fulfilled with the value
3. returns thenable promise by adopting its eventual state if fulfilled with thenable promise

This function flattens nested layers of promise-like objects (e.g. a promise that resolves to a promise that resolves to something) into a single layer.

Promise.resolve('Success').then((value) => {
console.log(value); // "Success"
}).catch((error) => {
console.log(error);
});

Promise.reject():

Promise.reject() method returns a Promise object that is rejected with a given reason.

Promise.reject('failure').then((value) => {
console.log(value);
}).catch((error) => {
console.log(error); // "failure"
});

Promise.then():

The then() method returns a Promise. It takes up to two arguments: callback functions for the success and failure cases of the Promise.

const promise1 = new Promise((resolve, reject) => {
resolve('Success!');
});
promise1.then((value) => {
console.log(value);
// expected output: "Success!"
}, (error) => {
console.log( error);
});

Promise.catch():

The catch() method returns a rejected Promise. It behaves the same as calling Promise.prototype.then(undefined, onRejected). Calling Promise.catch(onRejected) internally calls Promise.then(undefined, onRejected).

const promise1 = new Promise((resolve, reject) => {
throw 'Exception handling';
});
promise1.then((value) => {
console.log(value);
}).catch((error) => {
console.error(error);
});
> "Exception handling"

Promise.finally():

The finally() method returns a Promise. When the promise is settled, the specified callback function is executed. This provides a way for code to be run irrespective of promise settlement. A finally callback will not receive any argument, since there is no way of determining if the promise was fulfilled or rejected.

const promise1 = Promise.reject("Rejecting Promise");
promise1
.then(value => {
console.log(value)
})
.catch(err => {
console.log(err)
})
.finally(() => {
console.log("completed promise")
});
> "Rejecting Promise"
> "completed promise"

Common Promise utility methods:

Promise.all():

Promise.all() method takes an array of promises and returns a single promise, which is either resolved or rejected based on any iterable promise. It resolves if all the promises inside the array resolve and reject if any of the promises reject.

const promise1 = Promise.resolve("hello world");
const promise2 = "Promise 2";
const promise3 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'foo');
});
Promise.all([promise1, promise2, promise3]).then((values) => {
console.log(values);
});
// expected output: Array ["hello world", "Promise 2", "foo"]

Promise.race():

Promise.race() method also takes an array of promises and return a single promise, which is either resolved or rejected based on an array of iterable promise. Unlike promise.all() it will not wait till all the promise executes. It will return the promise as soon as any of the promises is either resolve or reject.

const promise1 = new Promise((resolve, reject) => {
setTimeout(resolve, 300, 'Hello world');
});
const promise2 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'Goodbye world');
});
Promise.race([promise1, promise2]).then((value) => {
console.log(value);
// Both resolve, but promise2 is faster
});
> "Goodbye world"

Promise.any():

Promise.any() method takes an array of promises and returns a single promise. It will resolve if any of the promises in an array are resolved with the resolved value. If all the promises are rejected, promise will be rejected with the error “AggregateError: All promises were rejected”. AggregateError, a new subclass of Error that groups together individual errors.

const promise1 = Promise.reject(0);
const promise2 = Promise.resolve('Hello world');
const promise3 = new Promise((resolve) => setTimeout(resolve, 300, 'Good bye'));
const promises = [promise1, promise2, promise3];Promise.any(promises).then((value) => console.log(value));> Hello world

Promise.allSettled():

Promise.allSettled() method takes an array of promises and returns a single promise. This is typically used when promises inside an array are independent of each other and rejection of one promise should not stop the other promise. The main difference between Promise.all() and Promise.allSettled() is that prior stops the execution of any of the promises rejects and mostly used in a case where promises are dependent on each other whereas following will wait until all the promises are settled and give the result in array form.

const promise1 = Promise.resolve("Hello world");
const promise2 = Promise.reject('Rejecting');;
const promises = [promise1, promise2];
Promise.allSettled(promises).
then((results) => results.forEach((result) => console.log(result)));
> Object { status: "fulfilled", value: "Hello world" }
> Object { status: "rejected", reason: "Rejecting" }

In an upcoming post, we will look at async/await, which is more syntactical sugar on top of promises that can radically simplify code, add readability, & significantly reducing lines of code.

Thanks for reading. Originally published at https://noob2geek.in/ on 26th May 2021.

More content at plainenglish.io

--

--

Javascript Full-stack developer with a passion for building highly scalable and performant apps.