How to Type-Check Async Functions & Promises in TypeScript

If you enjoy this story, feel free to like or share it!

---

I’m a detective in a city, tasked with solving a complex mystery. The mystery revolves around a secret code that people are whispering in the shadows—this code represents asynchronous functions and Promises in TypeScript. As a detective, I need a special tool to decipher these codes, and that tool is type-checking.

In my detective world, each asynchronous function is like a secret letter. However, these letters don’t reveal their full message immediately. Instead, they promise to unveil their secrets at some point in the future. That’s where Promises come in—they’re like trusted messengers who assure me that the letter will eventually arrive.

But to ensure my investigation is accurate, I need a way to verify these letters and messengers. This is where TypeScript comes into play. It’s like having a magnifying glass that lets me examine the letters before they even arrive. With this magnifying glass, I can see the shape and form of the message to come, even if the details are still hidden.

For instance, when I come across a Promise, I use my magnifying glass to look at the “resolve” type, which tells me what kind of information the messenger will eventually deliver. This foresight allows me to plan my investigation accordingly, knowing what kind of clues I should expect.

As I continue my investigation, I might encounter an asynchronous function. This is like receiving a letter with an invisible ink message. I use my magnifying glass to determine the function’s return type, which is always a Promise. I can then anticipate the type of information the ink will eventually reveal once the solution is applied.

With TypeScript’s type-checking, I become a more efficient detective, avoiding missteps and ensuring that each clue I gather aligns perfectly with the unfolding narrative of my case. By understanding the types of these asynchronous codes, I can solve the mystery with precision and confidence.

And that’s how I navigate the world of asynchronous functions and Promises, using the power of TypeScript to illuminate the path ahead in my detective story.

---

I receive a tip about an upcoming letter, which in coding terms is an asynchronous function. Here’s how I might define it:

async function getSecretMessage(): Promise<string> {
    //  this is the secret letter being written
    return "The eagle flies at dawn";
}

In this example, the function getSecretMessage promises to return a string. My trusty magnifying glass (TypeScript) tells me upfront that once the letter (function) is fully revealed, it will provide a string message. This helps me prepare my investigation tools to handle a string.

Now, let’s say I have a messenger (a Promise) delivering a crucial package. Here’s how I handle it:

function getPackage(): Promise<{ contents: string, sender: string }> {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve({ contents: "Top Secret Documents", sender: "Agent Smith" });
        }, 2000);
    });
}

With this code, my magnifying glass allows me to see that the package will eventually contain an object with contents and sender as strings. This foresight ensures I’m ready to handle this precise type of package when it arrives.

As I continue my investigation, I use the await keyword to pause and examine these deliveries as they arrive:

async function investigate() {
    const message = await getSecretMessage();
    console.log(`Received message: ${message}`);

    const package = await getPackage();
    console.log(`Package contents: ${package.contents}, from: ${package.sender}`);
}

investigate();

In the investigate function, I pause for each letter and package, ensuring I fully understand their contents before proceeding. This methodical approach allows me to solve the mystery efficiently.

Key Takeaways:

1. TypeScript as a Magnifying Glass: TypeScript helps us understand what types of data we can expect from asynchronous functions and Promises, allowing us to plan our code more effectively.
2. Asynchronous Functions and Promises: They allow us to write code that waits for operations to complete without blocking the flow of the program. TypeScript enhances this by ensuring type safety.
3. Precision in Coding: Just like a detective needs accuracy in his investigation, using TypeScript ensures we handle data types correctly, preventing errors and improving code reliability.