How can you handle asynchronous operations in TypeScript?

Handling asynchronous operations in TypeScript typically involves several methods, including callback functions, Promises, and async/await. Below are detailed explanations and examples for each approach:

1. Callback Functions

Callback functions represent an older technique for asynchronous handling, where a function is passed as a parameter to another function and invoked upon completion. This method can lead to callback hell, particularly when managing multiple sequential asynchronous operations.

Example:

typescript
function readFile(filename: string, callback: (err: Error | null, data: string | null) => void) {
    setTimeout(() => {
        if (filename !== "existing file.txt") {
            callback(new Error("file does not exist"), null);
        } else {
            callback(null, "file content");
        }
    }, 1000);
}

// Call the function
readFile("existing file.txt", (err, data) => {
    if (err) {
        console.log(err.message);
    } else {
        console.log(data);
    }
});

2. Promises

A Promise is an object representing the eventual completion or failure of an asynchronous operation. It enables associating the success value or failure reason with the asynchronous process. Promises resolve the callback hell issue, resulting in more readable and maintainable code.

Example:

typescript
function readFile(filename: string): Promise<string> {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            if (filename === "existing file.txt") {
                resolve("file content");
            } else {
                reject(new Error("file does not exist"));
            }
        }, 1000);
    });
}

// Using Promises
readFile("existing file.txt").then((content) => {
    console.log(content);
}).catch((error) => {
    console.log(error.message);
});

3. async/await

async/await is syntactic sugar built on top of Promises, allowing asynchronous code to resemble synchronous code. The async keyword declares an asynchronous function, while await is used to wait for the result of an asynchronous operation within the function.

Example:

typescript
async function getFilesContent(filename: string): Promise<void> {
    try {
        // await is used to wait for the asynchronous operation
        const content = await readFile(filename);
        console.log(content);
    } catch (error) {
        console.log(error.message);
    }
}

// Call the asynchronous function
getFilesContent("existing file.txt");

Among these approaches, it is generally recommended to use Promises or async/await, as they provide clearer and more manageable code structures, especially for complex asynchronous logic. Additionally, async/await makes the code more intuitive by reducing the need for chaining .then() and .catch() methods.