Image for post
Image for post

📄 Table of Contents

Brief Introduction to Promises

According to MDN Docs, A Promise is an object representing the eventual completion or failure of an “Asynchronous” operation.

◉ What is a Callback?

Image for post
Image for post

Callback Hell

Image for post
Image for post
Image for post
Image for post

◉ JavaScript Promises

Image for post
Image for post

◉ Creating a Promise

const myPromise = new Promise();
const myPromise = new Promise((resolve, reject) => {  
// condition
});
let completed = true;
const myPromise = new Promise((resolve, reject) => {
if(completed) {
resolve('Promise is resolved successfully.');
} else {
reject('Promise is rejected');
}
});
Image for post
Image for post
let completed = true;
const myPromise = new Promise((resolve, reject) => {
setTimeout(() => {
if(completed) {
resolve('Promise is resolved successfully.');
} else {
reject('Promise is rejected');
}
}, 3000)
});
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post

Consuming a Promise: then, catch, finally

1) The .then() method

Image for post
Image for post

2) The catch() method

Image for post
Image for post

3) The finally() method

Image for post
Image for post

◉ promise.race, any, all, allSettled

Image for post
Image for post

Promise.any

Promise.race()

Image for post
Image for post

This is very similar to the Promise.any method, however, it has one key difference. While Promise.any will return only if one of the promises is Fulfilled, Promise.race will return if any of the promises are Settled.

Promise.all()

Image for post
Image for post

Promise.allSettled()

Image for post
Image for post

Summary

Experience with Front-end Technologies and MERN / MEAN Stack. Working on all Major UI Frameworks like React, Angular.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store