Original text: fettblog. Eu/void – in – jar… Doodle code dragon

If you’ve ever written a strongly typed language, you’re familiar with the concept of void: when functions and methods are called, nothing is returned.

Void is an operator in JavaScript and a primitive type in TypeScript. Void behaves differently in the two environments.

In JavaScriptvoid

Void in JavaScript is the operator that executes expressions. Void always returns undefined regardless of the result of expression execution

let i = void 2; // i === undefined
Copy the code

So why is it needed? First, early on we could override undefined to give the exact value. Void always returns true undefined.

Second, it’s a great way to call a function that executes immediately:

void function() {
  console.log('What')
}()
Copy the code

Does not pollute the global namespace:

void function aRecursion(i) {
  if(i > 0) {
    console.log(i--)
    aRecursion(i)
  }
}(3)

console.log(typeof aRecursion) // undefined
Copy the code

Since void always returns undefined and void always executes the expression immediately following it, there is a convenient way to do this: the function returns no value, but still calls callback:

// Return other values, app crashes
function middleware(nextCallback) {
  if(conditionApplies()) {
    return voidnextCallback(); }}Copy the code

For me, the most important function of void is the app’s security gate. Since the function returns undefined by default, we can also define it explicitly.

button.onclick = (a)= > void doSomething();
Copy the code

In the TypeScriptvoid

Void in TypeScript is a subtype of undefined. Functions in JavaScript always return a value, or undefined.

function iHaveNoReturnValue(i) {
  console.log(i)
} / / returns undefined
Copy the code

Functions that do not return a value always return undefined, void in JavaScript always returns undefined, and void in TypeScript is an appropriate type to indicate that a function returns undefined:

declare function iHaveNoReturnValue(i: number) :void
Copy the code

Void can be used for arguments and other declarations, and only undefined can be passed:

declare function iTakeNoParameters(x: void) :void

iTakeNoParameters() / / 👍iTakeNoParameters(undefined) / / 👍iTakeNoParameters(void 2) / / 👍Copy the code

So void is almost the same as undefined. Void is a slightly different return type, which can be replaced by a different type, allowing advanced callback modes:

function doSomething(callback: () => void) {let c = callback(); Callback(): number {return 2; } // 👍 type safety is guaranteed in doSometing doSomething(aNumberCallback)Copy the code

This expected behavior is often used in JavaScript applications. Patterns of replacability can be read in my other articles.

If you want to ensure that the function passed in returns only undefined, you need to modify the type definition of callback:

- function doSomething(callback: () => void) {
+ function doSomething(callback: () => undefined) { /* ... */ }function aNumberCallback(): number { return 2; } // 💥 type does not match doSomething(aNumberCallback)Copy the code