DEV Community

Cover image for JavaScript Promises: The Scrolls of Asynchronous Magic(Part 2)
Chandan Singh
Chandan Singh

Posted on

JavaScript Promises: The Scrolls of Asynchronous Magic(Part 2)

Hello again, my fellow apprentice wizards of the coding realm! 🧙‍♂️ Last time, we discussed the mystical Promises in JavaScript—a tool so powerful it can make or break your quest in the magical world of asynchronous code. Today, we shall delve deeper into the Book of Promises to unveil more advanced spells, clever techniques, and hidden chambers of wisdom. Get ready to expand your magical toolkit!

The Basic Summoning Spell Revisited

Remember our basic summoning spell (Promise) from last time?


const basicSpell = new Promise((resolve, reject) => {
  // casting spell
  if (true) {
    resolve('Spell successful!');
  } else {
    reject('Spell failed!');
  }
});

Enter fullscreen mode Exit fullscreen mode

The Art of Chaining Promises

One of the first advanced techniques you’ll learn is "chaining." Picture a series of spells that feed into each other like a chain of mystical energy.


firstSpell()
  .then((result1) => secondSpell(result1))
  .then((result2) => thirdSpell(result2))
  .catch((error) => console.log(`The spell chain broke: ${error}`));

Enter fullscreen mode Exit fullscreen mode

Promise.all: The Grand Summoning

Imagine being able to cast multiple spells at once and wait for all of them to complete! The Promise.all incantation allows you to do just that.


Promise.all([spellOne(), spellTwo(), spellThree()])
  .then((results) => {
    console.log(`All spells were successful! ${results}`);
  })
  .catch((error) => {
    console.log(`One of the spells failed: ${error}`);
  });

Enter fullscreen mode Exit fullscreen mode

Promise.race: The Duel of Spells

In some cases, you want to know which spell finishes first. Use Promise.race for this.


Promise.race([slowSpell(), fastSpell()])
  .then((winner) => {
    console.log(`The faster spell is: ${winner}`);
  });

Enter fullscreen mode Exit fullscreen mode

Handling Multiple Cases with Promise.allSettled

Sometimes, you'd want to know the outcome of all spells, whether they succeed or fail. Promise.allSettled comes to your rescue here.


Promise.allSettled([riskySpell(), safeSpell()])
  .then((results) => results.forEach((result) => console.log(`Outcome: ${result.status}`)));

Enter fullscreen mode Exit fullscreen mode

Further Reading for Aspiring Magicians

Hungry for more? Check out the MDN Documentation on Promises to further expand your spellbook.

Sorcerer’s Assignments: Test Your Magic 🌟

  1. Chain of Fates: Create a chain of 3 promises and handle their outcome.
  2. Spellbinders: Use Promise.all to execute multiple promises and display their results.
  3. Grandmaster’s Duel: Employ Promise.race to determine the faster of two promises.
  4. Oracle's Sight: Use Promise.allSettled to assess the results of multiple promises, combining this lesson with the last blog's object manipulations.

Conclusion

And thus, we close another chapter in our Book of Promises. As you experiment with these versatile spells, remember that the essence of mastering Promises lies in understanding their flexibility and potential to make your coding life magical!

Happy coding, wizards! 🌟

Top comments (0)