Page cover

JavaScript Promise API Cheat Sheet

🚀 [GIF] Cheatsheet for Javascript Promise API methods - Promise.all, Promise.allSettled, Promise.race, Promise.any

Hello everybody 👋! I created this GIF cheatsheet for my own reference and I hope it will be useful fo...

Hello everybody 👋! I created this GIF cheatsheet for my own reference and I hope it will be useful for the community as well ❤️

Index

  • How is this organized?

  • Promise.resolve,Promise.reject

  • Promise.all

  • Promise.allSettled

  • Promise.race

  • Promise.any

Consider the GIFs like watching a slow-mo video of Promise API methods in action. The scenarios for each Promise API describe how they work with an emphasis on Promise status transition, value/reasons, and the order.

For the sake of simplicity, I have added numbers below each promise representing the order in which they settle. This is handy while understanding the short-circuiting behavior (denoted by ⚡️) of each promise API.

Scenario 1: If the given value is not a thenable but a valid Javascript value\

Scenario 2: If the given value is a thenable (i.e., Promise or object with then() method\

Scenario 3: Nested Promise-like objects\

Scenario: Rejection with a reason\

Scenario 1: All passed-in Promises get fulfilled\

Scenario 2: ⚡️ One or more of the passed-in Promise(s) rejects\

Scenario 3: ⚡️ All passed-in Promises get rejected\

Scenario 4: Passing an Empty iterable\

Scenario 1: All passed-in Promises get fulfilled\

Scenario 2: One or more of the passed-in Promise(s) rejects\

Scenario 3: All passed-in Promises get rejected Promise.allSettled - All passed-in Promises get rejected

Scenario 4: Passing an Empty iterable Promise.allSettled - Passing an Empty iterable

Scenario 1: ⚡️ All passed-in Promises get fulfilled ⚡️Promise.race - All passed-in Promises get fulfilled

Scenario 2: ⚡️ One or more of the passed-in Promise(s) rejects ⚡️Promise.race - One or more of the passed-in Promise(s) rejects

Scenario 3: ⚡️ All passed-in Promises get rejected ⚡️Promise.race - All passed-in Promises get rejected

Scenario 4: Passing an Empty iterable Promise.race - Passing an Empty iterable

⚠️ Warning - Promise.any() method is experimental and not fully supported by all browsers. It is currently in the TC39 Candidate stage (Stage 3).

Scenario 1: ⚡️ All passed-in Promises get fulfilled ⚡️ Promise.any - All passed-in Promises get fulfilled

Scenario 2: ⚡️ One or more of the passed-in Promise(s) rejects ⚡️ Promise.any - One or more of the passed-in Promise(s) rejects

Scenario 3: All passed-in Promises get rejected Promise.any - All passed-in Promises get rejected

Scenario 4: Passing an Empty iterable Promise.any - Passing an Empty iterable

And hey, I love staying in touch with the curious folks and learning from them as well! ❤️ So, Please feel free to reach out if you have any questions or interesting thoughts 🙋‍♀️🙋‍♂️Don't forget to share this post if you found it useful 🚀


Repo Link :

Javascript concepts and features visualised in the form of GIFS. I use it for my own reference. Glad if it was useful for you !

Do you find the documentation hard to understand ? Worry no more, the GIFs got you covered!

Contents

Feel free to contribute ❤️

Source

Last updated

Was this helpful?