Working with Promises in TypeScript

Introduction

Asynchronous programming is a common requirement in web development, and Promises provide a powerful way to handle asynchronous operations in TypeScript. Promises represent a value that might not be available yet but will be at some point, allowing you to work with asynchronous data in a more structured and readable manner. In this guide, we'll explore the concept of Promises in TypeScript, how to create and use them, and handle asynchronous operations effectively.

What is a Promise?

A Promise in TypeScript represents a value that may not be available immediately. It is a placeholder for the result of an asynchronous operation. A Promise can be in one of three states:

• Pending: The initial state before the Promise is fulfilled or rejected.
• Fulfilled (resolved): The state when the asynchronous operation is successful, and a result is available.
• Rejected: The state when the asynchronous operation encounters an error or is unsuccessful.

Creating a Promise

In TypeScript, you can create a Promise using the Promise constructor. The Promise constructor takes a single argument, a function (executor), which receives two callback functions: resolve and reject.

Example:

const myPromise = new Promise((resolve, reject) => {
    // Simulate an asynchronous operation
    setTimeout(() => {
        const randomNumber = Math.random();
        if (randomNumber > 0.5) {
            resolve(randomNumber);
        } else {
            reject(new Error("Operation failed."));
        }
    }, 1000);
});
    

Using Promises

Once you have a Promise, you can use it to handle asynchronous results with the then() and catch() methods. The then() method is used when the Promise is fulfilled, and the catch() method handles errors when the Promise is rejected.

Example:

myPromise
    .then((result) => {
        console.log("Promise fulfilled. Result:", result);
    })
    .catch((error) => {
        console.error("Promise rejected. Error:", error.message);
    });
    

Chaining Promises

Promises can be chained using multiple then() calls to perform a sequence of asynchronous operations.

Example:

myPromise
    .then((result) => {
        console.log("First Promise fulfilled. Result:", result);
        return result * 2;
    })
    .then((doubledResult) => {
        console.log("Doubled Result:", doubledResult);
    })
    .catch((error) => {
        console.error("Promise rejected. Error:", error.message);
    });
    

Conclusion

Promises are a valuable tool for handling asynchronous operations in TypeScript. They provide a clear and structured way to work with asynchronous data and handle success and error scenarios. Understanding Promises is essential for writing efficient and reliable asynchronous code in modern web development.