In JavaScript, we often need to accomplish time-consuming tasks such as retrieving information from a database or running some computations. These are called asynchronous operations, because they do not complete immediately and require some time before they are finished.<\/p>\n\n\n\n
A Promise enables the tasks to be carried out in an orderly and easier manner. It stands for a value which will be available in due course even though it is not currently available.<\/p>\n\n\n\n
When should we use Promises and why are they useful?<\/p>\n\n\n\n
In the absence of promises, we used to have callbacks for all the asynchronous tasks, which could become complicated easily. With Promises, we are able to prevent this mishap and hassle, simplifying our work and making the code structured.<\/p>\n\n\n\n
In what way does a Promise work?<\/p>\n\n\n\n
Consider the following example. You can chain these tasks together using the then method to handle each one:<\/p>\n\n\n\n You can also handle multiple asynchronous tasks at once:<\/p>\n\n\n\n Here\u2019s how they work:<\/p>\n\n\n\n
Assume that you need to perform three tasks: walk your dog, clean the kitchen, and take out the trash. Each of these tasks promises to either successfully complete or fail.<\/p>\n\n\n\nfunction<\/strong> walkDog<\/strong>() {
return<\/strong> new<\/strong> Promise((resolve, reject) => {
const<\/strong> dogWalked = true;
if<\/strong> (dogWalked) {
resolve(“You walked the dog!”);
} else<\/strong> {
reject(“You didn’t walk the dog.”);
}
});
}
function<\/strong> cleanKitchen<\/strong>() {
return<\/strong> new<\/strong> Promise((resolve, reject) => {
const<\/strong> cleaned = false;
if<\/strong> (cleaned) {
resolve(“You cleaned the kitchen!”);
} else<\/strong> {
reject(“You didn’t clean the kitchen.”);
}
});
}
function<\/strong> takeTrash<\/strong>() {
return<\/strong> new<\/strong> Promise((resolve, reject) => {
const<\/strong> trashTakenOut = true;
if<\/strong> (trashTakenOut) {
resolve(“You took out the trash!”);
} else<\/strong> {
reject(“You didn’t take out the trash.”);
}
});
}<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\nwalkDog()
.then((message) => {
console.log(message);
return<\/strong> cleanKitchen();
})
.then((message) => {
console.log(message);
return<\/strong> takeTrash();
})
.then((message) => {
console.log(message);
console.log(“All tasks are done!”);
})
.catch((error) => {
console.log(“Oops! Something went wrong:”, error);
});
<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\nWorking with Multiple Promises<\/strong><\/h3>\n\n\n\n
\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n<\/ul>\n\n\n\nPromise.all<\/strong> Example:<\/strong><\/h4>\n\n\n\n
Promise.all([walkDog(), cleanKitchen(), takeTrash()])
.then((results) => {
console.log(“All tasks completed successfully:”, results);
})
.catch((error) => {
console.error(“Oops! One of the tasks failed:”, error);
});<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\nPromise.allSettled<\/strong> Example:<\/strong><\/h4>\n\n\n\n