How to Synchronously determine a JavaScript Promise’s State

Handling asynchronous operations in JavaScript can be challenging. However, Promises has made this task easier by providing a more elegant and better error management solution. Although Promise-based code is primarily designed to work asynchronously, there may be instances where you need to synchronously determine a Promise’s state for various reasons. In this article, we’ll explore how to do just that.

A Promise represents a value that might not be available yet but will be at some point in the future. It has three states:

• Pending: It is the state when the Promise is created and hasn’t been resolved or rejected yet.
• Fulfilled: The Promise has successfully resolved with a value.
• Rejected: The Promise has encountered an error or exception during its execution of code.

Need for Synchronously Determining a Promise’s State

In most cases, you should rely on the asynchronous nature of Promises to handle your operations. However, there might be scenarios where you need to synchronously check a Promise’s state. Here are a few common use cases:

• Error Handling: You may want to take different actions based on whether a Promise has been rejected or not. Synchronous checking can help you make immediate decisions.
• Conditional Execution: Depending on a Promise’s state, you might want to execute specific code paths synchronously.
• Debugging and Logging: For debugging purposes, you may need to know the state of a Promise at a particular point in your code.

.then() or .catch()

To synchronously determine a JavaScript Promise’s state, you can inspect its properties and methods. In particular, you can check if the Promise has the .then() or .catch() method, as these methods are added to a Promise object when it is created.

Example: In this example, we will see how to synchronously determine a JavaScript Promise’s state by using the .then and .catch methods.

Javascript

const myPromise = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("Successfull");
    }, 1000);
});

async function checkPromiseState() {
    try {
        const result = await myPromise;
        console.log("Promise is pending or fulfilled.");

        // Handle the fulfilled state here

    } catch (error) {
        console.log("Promise is rejected.");
    }
}

checkPromiseState();

Explanation

• In this example, we create a Promise myPromise and check for the existence of the .then() and .catch() methods.
• If the .then() method is present, the Promise is pending or fulfilled.
• If the .catch() method is present, the Promise is rejected.

Output:

Promise is pending or fulfilled.

Wrap Promises in a Synchronous Function

In this case, we can encapsulate the logic of checking a Promise’s state synchronously within a function. This function can return a value or trigger specific actions based on the Promise’s state.

Example: In this example, we will see how to synchronously determine a JavaScript Promise’s state by wrapping the promise inside a function.

Javascript

function checkPromiseState(promise) {
    return promise
        .then(() => "fulfilled")
        .catch(() => "rejected");
}

const myPromise = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("Success!");
    }, 1000);
});

checkPromiseState(myPromise)
    .then(state => {
        console.log(`Promise state: ${state}`);
    });

Explanation

• The checkPromiseState function encapsulates a Promise, resolving to “fulfilled” on success and “rejected” on error.
• An example Promise, myPromise, simulates an asynchronous task using setTimeout.
• The code invokes checkPromiseState on myPromise and logs the resulting state: “fulfilled” or “rejected,” indicating the Promise’s resolution.

Output:

Promise state: fulfilled