void Keyword in Typescript

Do you want to know about the Typescript void keyword? In this Typescript tutorial, I will explain how to use the void keyword in Typescript with a few practical examples and full code.

The void keyword in TypeScript is used to specify that a function does not return a value. It’s commonly applied to functions that perform actions or side effects without needing to return data. This explicit declaration enhances code readability and ensures consistency in type expectations, particularly in functions and callback scenarios.

What is the ‘void’ Keyword in TypeScript?

In TypeScript, void is a type that denotes the absence of any type. It’s commonly used to signify that a function doesn’t return a value. In JavaScript, when a function doesn’t return anything, it implicitly returns undefined. TypeScript’s void type is a more explicit way of expressing this.

When to Use ‘void’ in Typescript?

Here are a few scenarios on when to use the void keyword in Typescript.

  • Function Return Types: When you have a function that performs an action but doesn’t return a value.
  • Callback Functions: Often used in callback functions that don’t return a value.

‘void’ Keyword in TypeScript examples

Now, let us check a few examples of void keyword in Typescript.

1. Basic Usage in Functions

Consider a function that logs a message to the console but doesn’t return anything: Here is the complete code:

function greet(name: string): void {
    console.log(`Hello, ${name}!`);
}

greet('Alice');

In this example, the greet() function takes a string as an argument and returns void. It simply performs an action without returning any value.

Check out the below screenshot after I ran the code using Visual Studio code.

void keyword in typescript

2. As a Callback Function

void is also useful in scenarios involving callbacks in Typescript. Here is a complete code:

function processUserInput(callback: (input: string) => void) {
    let input = 'Sample input';
    callback(input);
}

processUserInput((input) => {
    console.log(`Processing: ${input}`);
});

Here, the processUserInput() function takes a callback function that receives a string and returns void. This pattern is common in event handling or asynchronous operations.

Check out the screenshot below for the output after I ran the code using Visual Studio code.

typescript void keyword

3. With Promises

When working with Promises, void can be used to indicate a Promise that doesn’t resolve with a value:

function asyncOperation(): Promise<void> {
    return new Promise((resolve) => {
        // Some asynchronous operation
        setTimeout(() => {
            console.log('Operation completed');
            resolve();
        }, 1000);
    });
}

asyncOperation().then(() => {
    console.log('Done');
});

In this example, asyncOperation() returns a Promise<void>, indicating that the resolved value is not meant to be used.

4. Arrow Functions

Arrow functions with implicit returns can also use void in Typescript. Here is the complete code:

const logMessage = (message: string): void => console.log(message);

logMessage('Hello, TypeScript!');

The logMessage() arrow function specifies void as the return type, emphasizing that it’s not meant to return a value.

Here are a few things to remember.

  • void vs. undefined: While void functions implicitly return undefined in JavaScript, using void in TypeScript is about signaling intent and improving code readability.
  • Avoiding void for Empty Returns: Functions that perform an action but don’t explicitly return a value are best described with void.

Conclusion

In this tutorial, we discussed in detail about TypeScript’s void keyword. We explored its primary function of indicating that certain functions do not return a value. Through various examples, we saw how to use the Typescript void keyword in basic functions, callback functions, promises, and arrow functions. We also addressed common misconceptions, distinguishing void from undefined. I hope you now understand how to use the void keyword in Typescript.

You may also like:

>