You don't need void 0 in JavaScript
Tags: javascript, webdev, beginners, programming
Published: 2022-05-10 09:42:51

In JavaScript code, especially in older legacy code, you sometimes find the expression `void 0`. 

The [void operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void) evaluates an expression and returns the primitive value [undefined](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined). `void 0` evaluates `0`, which does nothing, and then returns `undefined`. It is effectively an alias for `undefined`.

## Why is void 0 used as an alias for undefined?

One of JavaScript's quirks is that `undefined` is not a reserved keyword. Instead, it is a property of the [global object](https://developer.mozilla.org/en-US/docs/Glossary/Global_object).

**Before ES5 (2009), it was possible to modify the `undefined` global property, which could lead to unexpected behavior for `undefined`.** 

Consider the following example (which does not work in modern JavaScript engines):

```javascript
// Pre-ES5 example - does not work in modern JS engines:

// changes property 'undefined' on the global object:
undefined = "something else"; 

// potentially in some other JavaScript file or script section:
if (aVariable === undefined) {
  // aVariable is equal to "something else", 
  // but not to the primitive value 'undefined'
  doSomething();
}
```

Modifying the `undefined` global could even happen in 3rd party code, e.g., libraries imported via the script tag. Since `void 0` always returns the actual primitive value `undefined`, it was commonly used before ES5 to make the code failsafe against the re-definition of the `undefined` global property.

## The global property 'undefined' after ES5

The problem that `undefined` could be modified on the global object was so big that the JavaScript standard was changed.
**With ES5, the global property `undefined` became read-only.** Attempting to change the value does nothing in modern JavaScript:

```javascript
globalThis.undefined = "something else";
console.log(undefined); // prints undefined in modern browsers
```

## Undefined can still be shadowed by a local variable
However, while changing the `undefined` global property is no longer possible, `undefined` is still not a reserved keyword in JavaScript. Therefore it can still be shadowed by a local variable:

```javascript
const undefined = "something else";
let check = aVariable === void 0; // void 0 is needed here
```

Having a local variable with the name `undefined` is a pitfall that you want to avoid. The [ESLint rule no-undefined](https://eslint.org/docs/rules/no-undefined) disallows the use of undefined as a variable name and prevents shadowing issues.

## Can void 0 help reduce the bundle size?
The expression `void 0` is shorter than `undefined`. JavaScript bundle sizes are essential for creating websites that load quickly, and shaving off a few bytes can help. 

However, it is best to **leave basic code size optimizations to minifiers** such as [Terser](https://github.com/terser/terser) as part of the product bundling process. They can perform many different optimizations, and the source code remains more readable without any manual code size optimizations like using `void 0` instead of `undefined`.

## Avoid void 0 in modern JavaScript

To summarize, in modern browsers and JavaScript engines, there is no reason to use `void 0` any longer:

* the global property `undefined` cannot be changed in ES5 and newer environments
* local variables with the name `undefined` can be disallowed with the [ESLint rule no-undefined](https://eslint.org/docs/rules/no-undefined)
* minifiers can replace `undefined` with `void 0` when creating the production bundle

On the contrary, `void 0` makes JavaSCript code harder to read and understand because you need to know the meaning of `void 0` and process different terms (`void 0`, `undefined`) for the same concept (`undefined`).

TLDR: **You can use `undefined` and remove the unnecessary `void 0` complication.**