Understanding Promises in JavaScript – Part 2

[RAMANA MURTHY G]

Hello folks! 👋

This article is a continuation of my previous post on Synchronous vs Asynchronous Calls and JavaScript Promises. If you haven’t checked it out yet, you can read it here: 

🔗 Part 1: JavaScript Promises – Synchronous vs Asynchronous 

In this article, we’ll dive deeper into JavaScript Promises—what they are, how to create them, and how they help us handle asynchronous operations more effectively in JavaScript.

Asynchronous operations run independently of the main program flow. If not handled properly, they can cause unexpected behaviors. Promises provide a cleaner, more manageable way to deal with such operations.

💡 What is a Promise in JavaScript?

A Promise is a JavaScript object that represents the eventual result (or failure) of an asynchronous operation. It can be in one of the following three states:

• Pending: Initial state, the operation is still in progress.
• Fulfilled: The operation completed successfully.
• Rejected: The operation failed with an error.

Put simply, a Promise acts as a placeholder for a value that is not immediately available but will be resolved in the future.

❓ Why Do We Use Promises?

If you've ever struggled with callback hell (i.e., deeply nested callbacks that become hard to read and manage), you'll appreciate Promises.

A callback is a function passed into another function as an argument. But excessive nesting of callbacks makes code difficult to maintain and debug.

Promises help solve this issue by:

• Improving readability
• Simplifying error handling
• Supporting chaining of asynchronous tasks

⚙️ How Promises Work (Visual Flow)

A Promise starts execution the moment it’s created and enters the Pending state. Depending on the outcome, it moves to either the Fulfilled or Rejected state.

Once resolved or rejected, the outcome can be handled using .then() for success and .catch() for errors.

🛠️ Creating a Promise in JavaScript

Here's how you can create a basic Promise using the Promise constructor:

let promiseExample = new Promise(function(resolve, reject) {
    // your asynchronous code goes here
});

The constructor takes a function with two parameters: resolve and reject. You call resolve() when the task succeeds and reject() when it fails.

let value = "";
let samplePromise = new Promise(function(resolve, reject) {
    if (value) {
        resolve("Promise Resolved");
    } else {
        reject("Promise Rejected");
    }
});

console.log(samplePromise);

In the above code snippet, we can further make API Calls in the resolve() block.

✅ Execution Pattern of a Promise

This example illustrates how JavaScript handles the execution order of promises.

let samplePromise = new Promise((resolve, reject) => {
    console.log("Synchronous Execution");
    if (true) {
        resolve("Success");
    } else {
        reject("Error");
    }
});

samplePromise
    .then((data) => {
        console.log("Asynchronous execution: " + data);
    })
    .catch((error) => {
        console.log("Asynchronous execution: " + error);
    });

console.log("Promise Example");

/*
Output:
Synchronous Execution
Promise Example
Asynchronous execution: Success
*/

🔍 Explanation:

• The code inside the Promise constructor runs synchronously.
• The .then() and .catch() handlers are asynchronous and executed after the synchronous code finishes.
• That’s why you see "Promise Example" printed before the resolved result.

This was a quick overview of how Promises work in JavaScript and how to create and use them. They are essential tools when dealing with asynchronous logic, especially in modern web development.

Check part 3 here

JavaScript Promises - Using promises in ServiceNow Scripting Part 3 

🙏 If you found this article helpful:

• Please mark it as Helpful
• Feel free to share your thoughts, suggestions, or questions in the comments

Thanks for reading! 😊

Ramana Murthy G
ServiceNow Developer

Note: I used ChatGPT to help with the restructuring and phrasing of the article body to ensure better clarity and flow.