You Don’t Need void 0 in JavaScript | by Lars Grammel | May, 2022

Right here’s a greater different

In JavaScript code, particularly in older legacy code, you generally discover the expression void 0.

The void operator evaluates an expression and returns the primitive worth undefined. void 0 evaluates 0, which does nothing, after which returns undefined. It’s successfully an alias for undefined.

Considered one of JavaScript’s quirks is that undefined is just not a reserved key phrase.
As a substitute, it’s a property of the global object.

Earlier than ES5 (2009), it was doable to switch the undefined world property, which may result in surprising conduct for undefined.

Take into account the next instance (which doesn’t work in fashionable JavaScript engines):

// Pre-ES5 instance - doesn't work in fashionable JS engines:// adjustments property 'undefined' on the worldwide object:
undefined = "one thing else";
// probably in another JavaScript file or script part:
if (aVariable === undefined)
// aVariable is the same as "one thing else",
// however to not the primitive worth 'undefined'

Modifying the undefined world may even occur in third social gathering code, e.g., libraries imported by way of the script tag. Since void 0 at all times returns the precise primitive worth undefined, it was generally used earlier than ES5 to make the code failsafe in opposition to the re-definition of the undefined world property.

The issue that undefined might be modified on the worldwide object was so massive that the JavaScript normal was modified.

With ES5, the worldwide property undefined turned read-only.

Trying to vary the worth does nothing in fashionable JavaScript:

globalThis.undefined = "one thing else";
console.log(undefined); // prints undefined in fashionable browsers

Nonetheless, whereas altering the undefined world property is not doable, undefined continues to be not a reserved key phrase in JavaScript. Subsequently it will possibly nonetheless be shadowed by an area variable:

const undefined = "one thing else";
let verify = aVariable === void 0; // void 0 is required right here

Having an area variable with the title undefined is a pitfall that you just need to keep away from. The ESLint rule no-undefined disallows the usage of undefined as a variable title and prevents shadowing points.

The expression void 0 is shorter than undefined. JavaScript bundle sizes are important for creating web sites that load rapidly, and shaving off a couple of bytes may help.

Nonetheless, it’s best to depart primary code dimension optimizations to minifiers resembling Terser as a part of the product bundling course of. They will carry out many various optimizations, and the supply code stays extra readable with none handbook code dimension optimizations like utilizing void 0 as an alternative of undefined.

To summarize, in fashionable browsers and JavaScript engines, there is no such thing as a cause to make use of void 0 any longer:

  • the worldwide property undefined can’t be modified in ES5 and newer environments
  • native variables with the title undefined will be disallowed with the ESLint rule no-undefined
  • minifiers can substitute undefined with void 0 when creating the manufacturing bundle

Quite the opposite, void 0 makes JavaSCript code tougher to learn and perceive as a result of it is advisable know the which means of void 0 and course of completely different phrases (void 0, undefined) for a similar idea (undefined).

TLDR: You should utilize undefined and take away the pointless void 0 complication.

More Posts