Understanding the ‘Void’ Type in TypeScript

Updated: January 7, 2024 By: Guest Contributor Post a comment

Introduction

In the expanse of type declarations, where the TypeScript prairies stretch out in all their statically-typed beauty, there exists a barren plot, a placeholder of nothingness, denoted ‘void’. It’s the realm where functions, eschewing any notion of a return, saunter off into the sunset leaving not a value behind.

The Essence of ‘Void’

Contrary to its name suggesting a vacuous absence, the ‘void’ type in TypeScript stands firm with purpose in these lands of code, allowing developers to dictate when a function returns precisely nada. Here, behold the simplest of examples:

function alertUser(message: string): void {
  alert(message);
}

‘Void’ in Asynchronous Functions

As we wade deeper into the async rivers, the ‘void’ type finds surer footing. Regard this illustration:

async function fetchData(url: string): Promise<void> {
  await fetch(url);
  // No return here
}

The ‘never’ Type

There is a less common relative of the ‘void’ type, whose name is ‘never’. Where ‘void’ whispers of emptiness, ‘never’ bellows of impossibility—assuring the caller that the function’s end will never be reached:

function error(message: string): never {
  throw new Error(message);
}

Realms Beyond Basic Functions

Now let us consider ‘void’ beyond the simplicity of singular functions. When adorning callbacks, it can impose that functions therein shall not return:

setTimeout((): void => {
  console.log('Vanishing like a ghost on horseback!');
}, 1000);

Advance ‘Void’ Techniques

The ‘void’ type in TypeScript can be wielded in more advanced scenarios, just as easily as an old riverboat navigates through the twists of the mighty Mississippi. Note its use in generic constraints, an area where ‘void’ ensures that specific generics abstain from returning:

function logAndReturn<T extends () => void>(func: T): void {
  func();
  console.log('Logged with nary a return in sight.');
}

When Void Meets Overloads

An experienced TypeScript wrangler knows that a function may wear many hats depending on the situation. Yonder, observe how ‘void’ accompanies function overloads with gracious aplomb:

function handleEvent(event: 'click'): void;
function handleEvent(event: string): string;
function handleEvent(event: any): any {
  if (event === 'click') {
    // Void gonna void
  } else {
    return 'Event type: ' + event;
  }
}

Etiquette in Interface Definitions

Even within the ornate ballrooms of interface definitions, ‘void’ completes the code’s ensemble with dignity:

interface UserAction {
  onClick: () => void;
  onHover(): void;
}

Conclusion

Understanding the ‘void’ landscape within TypeScript is akin to knowing every bend of the river—the river pilots of TypeScript can maneuver through functions with the surety that some simply are not meant to yield. It is the quiet strength of ‘void’ that not every function callback is obliged to contribute a return; sometimes, their sole task is to perform with silent anonymity.