I'm looking into the use cases for the good old void operator. One that I've seen mentioned is for preventing arrow functions from "leaking" their result, because of the way they're often written (see fn0 in example below).

So the argument is to use void to prevent such leaks in the cases you don't actually need the result (see fn2) but I don't really see what the difference is with just wrapping the statement in brackets (see fn1).

function doSomething(number) { return number + 1 }

const fn0 = () => doSomething(1)
const fn1 = () => { doSomething(1) }
const fn2 = () => void doSomething(1)

console.log(fn0()) // 2
console.log(fn1()) // undefined
console.log(fn2()) // undefined

I'm looking into the use cases for the good old void operator. One that I've seen mentioned is for preventing arrow functions from "leaking" their result, because of the way they're often written (see fn0 in example below).

So the argument is to use void to prevent such leaks in the cases you don't actually need the result (see fn2) but I don't really see what the difference is with just wrapping the statement in brackets (see fn1).

function doSomething(number) { return number + 1 }

const fn0 = () => doSomething(1)
const fn1 = () => { doSomething(1) }
const fn2 = () => void doSomething(1)

console.log(fn0()) // 2
console.log(fn1()) // undefined
console.log(fn2()) // undefined

Could someone explain to me what the differences are between fn1 and fn2? Does it do something different "under the hood"? Is it just a matter of convention / readability?

• javascript

Share Improve this question Follow edited Jan 18, 2020 at 10:23 CertainPerformance 372k5555 gold badges352352 silver badges357357 bronze badges asked Jan 18, 2020 at 10:21 SheraffSheraff 6,80233 gold badges3535 silver badges5959 bronze badges 2

• 2 I guess using void is more explicit so nobody (another developer, Future You, etc.) mistakenly thinks you just forgot a return statement? – Niet the Dark Absol Commented Jan 18, 2020 at 10:23
• "...but I don't really see what the difference is with just wrapping the statement in brackets..." There isn't any, both achieve the same result. Using void is just longer and more obscure. :-) – T.J. Crowder Commented Jan 18, 2020 at 10:27

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

All that void does is:

The void operator evaluates the given expression and then returns undefined.

So, it's the same as returning undefined.

When you don't explicitly return anything from a function, undefined is returned by default. So there's no difference here.

Other equivalents:

function doSomething(number) { return number + 1 }

const fn1 = () => { doSomething(1) }
const fn2 = () => void doSomething(1)
const fn3 = () => {
  doSomething(1);
  return undefined;
}
function fn4() {
  doSomething(1);
}
function fn5() {
  return void doSomething(1);
}
function fn6() {
  doSomething(1);
  return void 'foo';
}

console.log(fn1()) // undefined
console.log(fn2()) // undefined
console.log(fn3()) // undefined
console.log(fn4()) // undefined
console.log(fn5()) // undefined
console.log(fn6()) // undefined

(note that the use of an arrow function vs a non-arrow function doesn't make a difference, except for the fact that arrow functions can lack {s, in which case they implicitly return the following expression, which may be undefined or not)

...but I don't really see what the difference is with just wrapping the statement in brackets...

There isn't any significant difference, both achieve the same result. Using void is just more characters and more obscure. :-)

Could someone explain to me what the differences are between fn1 and fn2? Does it do something different "under the hood"?

Not really. It takes a different path to the same destination, but in both cases the result of calling the functions is undefined. As you know, fn1 gets there by using a full function body (the {}), and fn2 gets there by applying the void operator, but there's no subtle difference lurking in there.

Maybe you need to change the view on void, because this can clearly show in the code, to throw away a return value from a function by using a call and omit the result of it.

For example, if you have

void someFunction();

you describe a pattern, which returns something and this result is not used in the code.

If you have just this

someFunction();

and the function returns something useful, the review of the code may mention the unused result of it.