#Promise

1. 1. A promise in JavaScript is like a human promise we make to someone — we say we'll do something in the future, but we don't know the result yet. It may or may not happen, and we're not sure how it will turn out.
2. 2. Promise is a built-in object in JavaScript that represents the eventual completion (or failure) of an asynchronous operation and its resulting value.
3. 3. It is a better way to handle asynchronous operations than callback.
4. 4. It allow method chaining.
5. 5. It is a non-blocking operation.
6. 6. It is a single object that can have multiple states.
7. 7. Used for handling API calls, file operations, timers, etc.
8. 8. States of Promise:
   • Pending : Initial state, neither fulfilled nor rejected
   • Fulfilled : Operation completed successfully
   • Rejected : Operation failed
9. 9. How to create a Promise?
   1const newPromiseObject = new Promise((resolve, reject) => {
   2  // ...
   3});

   Here resolve and reject are two functions that are used to resolve and reject the promise. Resolve is used to resolve (represent fulfill) the promise and reject is used to reject the promise.
10. 10. Methods of to handle Promise:
    • then : It is used to handle the fulfilled state of the promise.
    • catch : It is used to handle the rejected state of the promise.
    • finally : It is used to handle the finally state of the promise.(runs after the promise is settled that is either fulfilled or rejected)
11. 11. How to consume a Promise?
    1newPromiseObject.then((result) => {
    2  // ...
    3}).catch((error) => {
    4  // ...
    5});

    Here then method is used to handle the fulfilled state of the promise and catch method is used to handle the rejected state of the promise.
12. 12. Promise Methods :
    • all : It is used to handle multiple promises. It takes an array of promises and returns a single promise that resolves when all the promises are resolved.
    • race : It is used to handle multiple promises. It takes an array of promises and returns a single promise that resolves when any of the promises are resolved.
    • any : It is used to handle multiple promises. It takes an array of promises and returns a single promise that resolves when any of the promises are resolved.
    • allSettled : It is used to handle multiple promises. It takes an array of promises and returns a single promise that resolves when all the promises are resolved.
13. 13. Real life example of Promise 😉 :

    You're a 22-year-old teenager, crushing hard on someone. You gather all your courage and message them on Instagram: "Hi beauty 😍". Now you wait...

    1const loveDM = new Promise((resolve, reject) => {
    2  console.log("Message sent: Hi beauty 😍");
    3
    4  // Simulate waiting for a reply...
    5  setTimeout(() => {
    6    const seenMessage = true;
    7    const replied = false;
    8
    9    if (seenMessage && replied) {
    10      resolve("Hey cutie! 💕"); // You got the reply!!
    11    } else {
    12      reject("Seen but no reply 😭"); // You got ghosted.
    13    }
    14  }, 3000); // Waiting for 3 seconds (just like refreshing chat every 2 sec in real life)
    15});
    16

    
    

    Let's explain the Three States of this Love Promise:

    • You sent the message: "Hi beauty 😍". Now you're checking your phone every 10 seconds, but no reply yet.
      This is the PENDING state. You're in hope 🥺
    • After 5 minutes, she replies: "Hey cutie 😚".
      This is the FULFILLED state. Your dopamine is sky high, you'resmiling at the screen like a clown 🤡💘
    • After 1 hour, she sees the another message, doesn't reply, and posts a story: "Don't text me if you're not rich 💅". You realize the DM is seen, but you're ignored.
      This is the REJECTED state. You're heartbroken, telling your friends: "Bro, I think she's talking about me in that story." 💔
    1const loveDM = new Promise((resolve, reject) => {
    2  console.log("Message sent: Hi beauty 😍");
    3
    4  setTimeout(() => {
    5    const seenMessage = true;
    6    const replied = false;
    7
    8    if (seenMessage && replied) {
    9      resolve("Hey cutie! 💕");
    10    } else {
    11      reject("Seen but no reply 😭");
    12    }
    13  }, 3000);
    14});
    15
    16loveDM
    17  .then((reply) => {
    18    console.log("Fulfilled:", reply);
    19  })
    20  .catch((error) => {
    21    console.log("Rejected:", error);
    22  });
    23

    
    
    Did you enjoy the example? Join our WhatsApp group:  Join Now