How to Determine a JavaScript Promise’s Status

By  on  

Promises have changed the landscape of JavaScript. Many old APIs have been reincarnated to use Promises (XHR to fetch, Battery API), while new APIs trend toward Promises. Developers can use async/await to handle promises, or then/catch/finally with callbacks, but what Promises don't tell you is their status. Wouldn't it be great if the Promise.prototype provided developers a status property to know whether a promise is rejected, resolved, or just done?

My research led me to this gist which I found quite clever. I took some time to modify a bit of code and add comments. The following solution provides helper methods for determining a Promise's status:

// Uses setTimeout with Promise to create an arbitrary delay time
// In these examples, a 0 millisecond delay is 
// an instantly resolving promise that we can jude status against
async function delay(milliseconds = 0, returnValue) {
  return new Promise(done => setTimeout((() => done(returnValue)), milliseconds));
}

// Promise.race in all of these functions uses delay of 0 to
// instantly resolve.  If the promise is resolved or rejected,
// returning that value will beat the setTimeout in the race

async function isResolved(promise) {
  return await Promise.race([delay(0, false), promise.then(() => true, () => false)]);
}

async function isRejected(promise) {
  return await Promise.race([delay(0, false), promise.then(() => false, () => true)]);
}

async function isFinished(promise) {
  return await Promise.race([delay(0, false), promise.then(() => true, () => true)]);
}

A few examples of usage:

// Testing isResolved
await isResolved(new Promise(resolve => resolve())); // true
await isResolved(new Promise((_, reject) => reject()));  // false

// Testing isRejected
await isRejected(new Promise((_, reject) => reject())); // true

// We done yet?
await isFinished(new Promise(resolve => resolve())); // true
await isFinished(new Promise((_, reject) => reject()));  // true

Developers can always add another await or then to a Promise to execute something but it is interesting to figure out the status of a given Promise. Is there an easier way to know a Promise's status? Let me know!

Recent Features

  • By
    fetch API

    One of the worst kept secrets about AJAX on the web is that the underlying API for it, XMLHttpRequest, wasn't really made for what we've been using it for.  We've done well to create elegant APIs around XHR but we know we can do better.  Our effort to...

  • By
    Convert XML to JSON with JavaScript

    If you follow me on Twitter, you know that I've been working on a super top secret mobile application using Appcelerator Titanium.  The experience has been great:  using JavaScript to create easy to write, easy to test, native mobile apps has been fun.  My...

Incredible Demos

  • By
    Jack Rugile’s Favorite CodePen Demos

    CodePen is an amazing source of inspiration for code and design. I am blown away every day by the demos users create. As you'll see below, I have an affinity toward things that move. It was difficult to narrow down my favorites, but here they are!

  • By
    HTML5 Context Menus

    One of the hidden gems within the HTML5 spec is context menus. The HTML5 context menu spec allows developers to create custom context menus for given blocks within simple menu and menuitem elements. The menu information lives right within the page so...

Discussion

  1. Gordon
    function state(promise: Promise) {
        let state = "pending";
        promise.then(() => state = "fulfilled", () => state = "rejected");
        return () => state;
    }
    
    const p = Promise.resolve(42);
    const s = state(p);
    console.log(s());   //  pending
    setTimeout(() => {
        console.log(s());  //  fulfilled
    }, 0);
    

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!