<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Tushar Kumar Raj</title>
    <description>The latest articles on Forem by Tushar Kumar Raj (@tusharcodes).</description>
    <link>https://forem.com/tusharcodes</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3799530%2Fcfd0b5cc-9d96-46d9-af66-38f2bc22efe9.png</url>
      <title>Forem: Tushar Kumar Raj</title>
      <link>https://forem.com/tusharcodes</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/tusharcodes"/>
    <language>en</language>
    <item>
      <title>What if JavaScript Promise Methods were IPL Teams?</title>
      <dc:creator>Tushar Kumar Raj</dc:creator>
      <pubDate>Sun, 01 Mar 2026 07:34:17 +0000</pubDate>
      <link>https://forem.com/tusharcodes/what-if-javascript-promise-methods-were-ipl-teams-288m</link>
      <guid>https://forem.com/tusharcodes/what-if-javascript-promise-methods-were-ipl-teams-288m</guid>
      <description>&lt;p&gt;We have all promised or got a promise from someone at some stage of life right? Promises like, "I will call you tomorrow" or "I won't do that next time" or "&lt;strong&gt;ee sala cup namde&lt;/strong&gt;" but it's not necessary that every promise will get fulfilled everytime right? A promise alone doesn't guarantee success.&lt;/p&gt;

&lt;p&gt;Strangely enough, it's similar in JavaScript, a promise represents something that is expected to be completed in future, it can either successfully complete or fail completely. But you might be wondering, why add something that doesn't guarantee success or why are we talking about a "promise" in programming?&lt;/p&gt;




&lt;h2&gt;
  
  
  What is a Promise?
&lt;/h2&gt;

&lt;p&gt;Well, JavaScript in itself is a single threaded programming language, which means it can do one task at a time, so if we have written long code for a website, then entire application will wait for API calls or database responses one by one before executing the next lines of code, which would make it look like its frozen. So promise was introduced as a placeholder for tasks that might resolve in future, this made it possible for execution of other code while waiting for long running operation to complete, making everything smoother.&lt;/p&gt;

&lt;p&gt;It is written as:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;promise&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;reject&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;condition&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

  &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;condition&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;promise kept&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; 
  &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;reject&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;better luck next time&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;});&lt;/span&gt;

&lt;span class="nx"&gt;promise&lt;/span&gt;
  &lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;then&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
  &lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="k"&gt;catch&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;err&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;err&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;We have created a promise using its constructor function. It consists of an executor function (for resolving promise) with 2 parameters.&lt;/p&gt;

&lt;p&gt;In real life every promise has a condition right? "I will call you tonight" is a condition, if they call you tonight then the promise was "resolved" or else it was "rejected", while you wait for night to fall the promise is "pending".&lt;/p&gt;

&lt;p&gt;Similarly here, the promise stays in pending state until either &lt;code&gt;resolve()&lt;/code&gt; or &lt;code&gt;reject()&lt;/code&gt; is called, the resolve parameter runs when the condition is true, while the reject parameter runs when the condition is false. These are the three states of promise.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;.then()&lt;/code&gt; is used to handle the value when the promise resolves, while &lt;code&gt;.catch()&lt;/code&gt; handles the error if the promise rejects.&lt;/p&gt;

&lt;p&gt;This promise sounds cool right? but what if multiple promises are running together? Wouldn't it be interesting to learn about them through IPL teams analogy?&lt;/p&gt;




&lt;h2&gt;
  
  
  Promise.all() - Royal Challengers Banglore's Calculator
&lt;/h2&gt;

&lt;p&gt;It's best time to be an RCB fan but you can never forget the good old days. Every time during mid season, our calculators were out and we calculated scenarios like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;We have to win all the remaining matches&lt;/li&gt;
&lt;li&gt;Mumbai Indians should beat Delhi Capitals&lt;/li&gt;
&lt;li&gt;Kolkata should lose their next match by high margin&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;If all these scenarios went our way then only RCB qualified. Otherwise, knocked out.&lt;/p&gt;

&lt;p&gt;This is exactly how &lt;code&gt;Promise.all()&lt;/code&gt; works:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;all&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="nf"&gt;match1&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;match2&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;match3&lt;/span&gt;&lt;span class="p"&gt;()])&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In this code, it waits for all promises to resolve, if any one of the match function returns reject, then the entire promise gets rejected, similar to how RCB getting knocked out of tournament if even one scenario doesn't go their way. If all promises resolve then it returns array of their result in same order.&lt;/p&gt;

&lt;p&gt;This is useful when you need all tasks to succeed, for example, fetching user data, posts, and notifications together before rendering a dashboard.&lt;/p&gt;




&lt;h2&gt;
  
  
  Promise.any() - Mumbai Indian's Qualification Hope
&lt;/h2&gt;

&lt;p&gt;Usually Mumbai Indians start the IPL with series of losses which in the end leads to dependence on one of many scenarios to go their way:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;They must win their final game&lt;/li&gt;
&lt;li&gt;Chennai Super Kings must defeat Punjab Kings&lt;/li&gt;
&lt;li&gt;Chennai Super Kings vs Punjab Kings get washed out due to rain&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Unlike RCB, they're fine as long as at least one of these conditions get satisfied.&lt;/p&gt;

&lt;p&gt;This describes &lt;code&gt;Promise.any()&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;any&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="nf"&gt;scenario1&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;scenario2&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;scenario3&lt;/span&gt;&lt;span class="p"&gt;()])&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It resolves as soon as one promise fulfills, it returns reject only when all promises get rejected. Similar to Mumbai Indian's case where they needed only one scenario to go their way.&lt;/p&gt;

&lt;p&gt;This is useful when you have multiple backup sources and you just need one successful response.&lt;/p&gt;




&lt;h2&gt;
  
  
  Promise.race() - Sunrisers Hyderabad's Start
&lt;/h2&gt;

&lt;p&gt;The Sunrisers Hyderabad has adopted a super aggressive approach in batting for quite some time now. But they have failed miserably when they are put under pressure during first powerplay. If powerplay doesn't go well then SRH crumbles, and fails to express themselves.&lt;/p&gt;

&lt;p&gt;Similar to this, is our &lt;code&gt;Promise.race()&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;race&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="nf"&gt;powerplay&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;middleOvers&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;deathOvers&lt;/span&gt;&lt;span class="p"&gt;()])&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It settles as soon as the first promise settles, powerplay in our analogy. It doesn't matter if the result of it is success or failure, first outcome decides everything, So if the powerplay is ruined whole match is ruined similar to SRH.&lt;/p&gt;

&lt;p&gt;A common use case of &lt;code&gt;Promise.race()&lt;/code&gt; is implementing timeouts. For example, you can race an API request against a timer. If the API responds first, you get the data. If the timer finishes first, you treat it as a timeout error.&lt;/p&gt;




&lt;h2&gt;
  
  
  Promise.resolve() - The Chennai Super Kings Dominance
&lt;/h2&gt;

&lt;p&gt;In past few years, CSK has been under a decline, but back in the days there used to be a saying "IPL is a tournament where teams participate to face CSK in final", it was like CSK's final qualification was guaranteed even before the season started.&lt;/p&gt;

&lt;p&gt;Similar to this is &lt;code&gt;Promise.resolve()&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Qualified for the Final&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It immediately returns a fulfilled promise, there are no conditions, no waiting, no dependency. Similar to how CSK's chances used to be for the final qualification.&lt;/p&gt;

&lt;p&gt;This is useful when you already have a value but want to return it as a promise. For example, if a function is expected to return a promise, you can use &lt;code&gt;Promise.resolve()&lt;/code&gt; to wrap a normal value inside a resolved promise.&lt;/p&gt;




&lt;h2&gt;
  
  
  Promise.reject() - Poor Punjab Kings and Delhi Capitals
&lt;/h2&gt;

&lt;p&gt;Punjab Kings and Delhi capitals have never won the IPL trophy, when people think of IPL the chances of winning for these two is mostly assumed to be a zero. It is like exact opposite of CSK.&lt;/p&gt;

&lt;p&gt;Similar to this is &lt;code&gt;Promise.reject()&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;reject&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Eliminated&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Its the direct counterpart of &lt;code&gt;Promise.resolve()&lt;/code&gt;, it immediately returns rejected promise and triggers &lt;code&gt;.catch()&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;It is often used to immediately return an error in a function that is expected to return a promise but you already know that it should fail under certain condition.&lt;/p&gt;




&lt;h2&gt;
  
  
  Promise.allSettled() - The Points Table
&lt;/h2&gt;

&lt;p&gt;Not a team here but the points table itself. The points table keep the record of each team in a visually understandable manner. The result of a match doesn't matter, its job is to show the result.&lt;/p&gt;

&lt;p&gt;That's how &lt;code&gt;Promise.allSettled()&lt;/code&gt; works:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;allSettled&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="nf"&gt;match1&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;match2&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="nf"&gt;match3&lt;/span&gt;&lt;span class="p"&gt;()])&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It waits for all promises to resolve, it doesn't matter if a promise fulfill or reject. It's job is to show the result of all promises in an array. Yes, it resolves an array:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="p"&gt;[&lt;/span&gt;
  &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;status&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;fulfilled&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;value&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;RCB won&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;status&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;rejected&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;reason&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;CSK lost&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;status&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;fulfilled&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;value&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;PKBS won&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This is what you will receive from &lt;code&gt;Promise.allSettled()&lt;/code&gt;. For fulfilled status it shows the value and for rejected status it shows the reason.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;Promise.allSettled()&lt;/code&gt; is useful when you want to run multiple independent tasks and need a complete report of all outcomes even if some fail. Great for debugging.&lt;/p&gt;




&lt;h2&gt;
  
  
  It was Never just About IPL
&lt;/h2&gt;

&lt;p&gt;IPL season of every team begins with a promise, just like every async operation in JavaScript.&lt;/p&gt;

&lt;p&gt;But what matters is not just whether something succeeds or fails, but how multiple outcomes are handled together.&lt;/p&gt;

&lt;p&gt;And that's what Promises are, different ways of handling uncertainties, just like how every IPL team handles their own. And maybe that's the reason IPL analogy fits so well.&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>javascript</category>
      <category>programming</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
