Promise kya hai?

Before we dive into code, lets first see what is a promise.

Mai Promise krta hoon mai ye kr doonga, pta nahi kab, bta doonga ki ye hoga ke nahi

The same is in JavaScript, it will let us know if it going to resolve or reject, but don't know when.

Now with Dragon Balls Analogy:

Goku calls Bulma that i will find the 4-star dragon Ball.

This is a promise between Goku and Bulma.

States of Promise

A Promise has three states:

1. Pending (Default state) -> Goku is still searching for 4-star dragon ball

2. Fulfilled -> Goku found the 4-star dragon ball

3. Rejected -> Goku couldn't find the ball.

Ab Promise Methods dekhte hain

There are few promise methods that I'll explain with anime analogy:

Setup

 const goku = new Promise((resolve) =>
  setTimeout(() => resolve("⭐ 1-star ball found"), 1000)
);

const vegeta = new Promise((resolve) =>
  setTimeout(() => resolve("⭐⭐ 2-star ball found"), 2000)
);

const gohan = new Promise((resolve) =>
  setTimeout(() => resolve("⭐⭐⭐ 3-star ball found"), 1500)
);

const piccolo = new Promise((resolve) =>
  setTimeout(() => resolve("⭐⭐⭐⭐ 4-star ball found"), 3000)
);

const krillin = new Promise((resolve) =>
  setTimeout(() => resolve("⭐⭐⭐⭐⭐ 5-star ball found"), 2500)
);

const tien = new Promise((resolve) =>
  setTimeout(() => resolve("⭐⭐⭐⭐⭐⭐ 6-star ball found"), 3500)
);

const yamcha = new Promise((resolve) =>
  setTimeout(() => resolve("⭐⭐⭐⭐⭐⭐⭐ 7-star ball found"), 8500)
);

Promise.all

This method takes an array of Promises and returns a Promise. It fulfills when all the promises fulfill, and rejects when any of the promise rejects.

nahi samjhe? aao anime se samajhte hain

Shenron tab tak nahi aayega jab tak saare 7 Dragon Balls nahi aa jaate

Promise.all([goku, vegeta, gohan, piccolo, krillin, tien, yamcha])
  .then(balls => {
    console.log("All balls collected:");
    balls.forEach(b => console.log(b));
    console.log("🐉 SHENRON SUMMONED! Make your wish!");
  })
  .catch(err => console.log("Wish failed:", err));


Output:

All balls collected:
⭐ 1-star ball found
⭐⭐ 2-star ball found
⭐⭐⭐ 3-star ball found
⭐⭐⭐⭐ 4-star ball found
⭐⭐⭐⭐⭐ 5-star ball found
⭐⭐⭐⭐⭐⭐ 6-star ball found
⭐⭐⭐⭐⭐⭐⭐ 7-star ball found
🐉 SHENRON SUMMONED! Make your wish!

Shenron will summon only when all the dragon balls are found, means when all the promises are resolved.

And it will take the same time of the last promise that fullfills, in this case yamcha takes 8500ms to find the ball. so the time taken by promise.all will be 8500ms.

If any promise fails/rejects, the Shenron will not summon.

Promise.allSettled()

This method takes an array of promises and returns the status of all promises.

Bulma Dragon Radar se sabhi fighters ko track karti hai, Chahe miley ya na miley

Now suppose Krilin and Yamcha fails to find

const krillin = new Promise((resolve, reject) =>
  setTimeout(() => reject("⭐⭐⭐⭐⭐ 5-star ball not found"), 2500)
);

const yamcha = new Promise((resolve, reject) =>
  setTimeout(() => reject("⭐⭐⭐⭐⭐⭐⭐ 7-star ball not found"), 500)
);

now for the status/report

Promise.allSettled([goku, vegeta, gohan, piccolo, krillin, tien, yamcha])
  .then(results => {
    console.log("BULMA'S DRAGON RADAR REPORT:");
    console.log("----------------------------");
    results.forEach((result, index) => {
      if (result.status === "fulfilled") {
        console.log(`✅ ${result.value}`);
      } else {
        console.log(`❌ ${result.reason}`);
      }
    });
  });


Output:

BULMA'S DRAGON RADAR REPORT:
---------------------------
✅ ⭐ 1-star ball found
✅ ⭐⭐ 2-star ball found
✅ ⭐⭐⭐ 3-star ball found
✅ ⭐⭐⭐⭐ 4-star ball found
❌ ⭐⭐⭐⭐⭐ 5-star ball not found
✅ ⭐⭐⭐⭐⭐⭐ 6-star ball found
❌ ⭐⭐⭐⭐⭐⭐⭐ 7-star ball not found

Promise.any()

This method takes an array of promises, and returns the first fulfilled result, if all fails, it throws an AggregateError.

Mujhe bas pehla successful fighter chahiye

Lets take an example,

Promise.any([goku, vegeta, gohan, piccolo, krillin, tien, yamcha])
  .then(firstSuccess => {
    console.log("Pehli ball mil gayi!");
    console.log(firstSuccess);
  })
  .catch(err => {
    console.log("Sabhi fighters fail ho gaye!");
    console.log(err.errors); // AggregateError - all rejection reasons
  });


Output:
Pehli ball mil gayi!
⭐ 1-star ball found

Kyun?:
Goku finds the ball in 1000ms
Then Gohan in 1500ms

What if everyone fails to find the balls:

Promise.any([yamcha, krillin])
  .then(result => console.log("Ball mili!", result))
  .catch(err => {
    console.log("Koi ball nhi mili");
    console.log("All failures:", err.errors);
  });

Output:
Koi ball nhi mili
All failures: ["⭐⭐⭐⭐⭐ 5-star ball not found","⭐⭐⭐⭐⭐⭐⭐ 7-star ball not found"] 

Promise.race()

It takes an array of promises, and returns a promise which will be the first to fulfill or fail from the input.

Example:

Mujhe pehle event ki zaroorat hai - chahe Yamcha ko mile ya Vegeta ko. Jo bhi pehle ho, usi pe react karo!

Promise.race([vegeta,yamcha, goku, gohan, krillin])
  .then(firstEvent => {
    console.log("Pehla event aaya - success!");
    console.log("First event - success!");
    console.log(firstEvent);
  })
  .catch(firstEvent => {
    console.log("Pehla event aaya - failure!");
    console.log("First event - failure!");
    console.log(firstEvent);
  });

Output:
Pehla event aaya - failure!
First event - failure!
⭐⭐⭐⭐⭐⭐⭐ 7-star ball not found

Kyun?
Yamcha fails to find the ball in 500ms
Goku finds it in 1000ms

race ko success ya failure se koi matlab nhi, bas pehla event chahiye.

Hope you like the promises explanation with dragon ball z analogy.