Void

The void operator is a unary operator that evaluates a given expression and explicitly returns the intrinsic primitive value undefined. It ensures that an expression is executed—allowing any side effects to occur—while strictly discarding the expression’s actual return value.

void expression
void (expression)

Note: void is a keyword, not a function. When parentheses are used, they act as the standard grouping operator, not as a function invocation.

Evaluation Mechanics

When the JavaScript engine encounters the void operator, it performs the following steps:

1. Evaluates the operand (the expression following the operator).
2. Executes any side effects contained within that expression (e.g., variable assignments, function calls).
3. Discards the result of the evaluated expression.
4. Returns the intrinsic undefined primitive.

// Basic evaluation
console.log(void 0);          // undefined
console.log(void "string");   // undefined
console.log(void (5 + 5));    // undefined

// Side effects are preserved
let counter = 0;
const result = void (counter++); 

console.log(counter); // 1 (The expression was evaluated)
console.log(result);  // undefined (The return value was discarded)

Safely Generating undefined

A primary historical and technical purpose of void 0 is to safely generate the undefined primitive. In JavaScript, undefined is a property of the global object, not a reserved keyword. Because it is merely an identifier, it can be shadowed by local variables or, in pre-ES5 environments, reassigned entirely.

Using void 0 guarantees the retrieval of the true intrinsic undefined value, immune to identifier shadowing.

function evaluateState(state) {
    // The local variable shadows the global 'undefined' identifier
    const undefined = "active"; 
    
    console.log(state === undefined); // Compares against the string "active"
    console.log(state === void 0);    // Safely compares against the primitive undefined
}

Operator Precedence

The void operator has very high precedence (matching other unary operators like typeof and !). Because of this, omitting grouping parentheses can lead to unintended evaluation orders.

The operator binds tightly to the immediate value or expression adjacent to it before subsequent binary operators are evaluated.

// Without grouping parentheses
void 1 + 2; 
// Parsed as: (void 1) + 2
// Evaluates to: undefined + 2
// Result: NaN

// With grouping parentheses
void (1 + 2);
// Parsed as: void (3)
// Evaluates to: undefined
// Result: undefined

// Equality checks
void 2 === '2'; 
// Parsed as: (void 2) === '2'
// Evaluates to: undefined === '2'
// Result: false

Parsing Context

In JavaScript, the function keyword at the beginning of a statement is parsed as a function declaration. Because void is a unary operator, placing it before the function keyword forces the JavaScript parser to treat the subsequent code as a function expression instead of a declaration.

// The parser treats this as an expression, evaluates it, 
// executes the IIFE, and returns undefined.
void function() {
    console.log("Parsed as an expression");
}();

Practical Use Cases

Suppressing Arrow Function Return Values In modern JavaScript, void is frequently used to suppress return values in single-line arrow functions. This is particularly useful when an API expects a type signature returning void or undefined, but you want to concisely invoke a function that returns a value. It prevents unintended side effects from leaking return values to the caller.

// The return value of doSomething() is discarded, 
// ensuring the onclick handler strictly returns undefined.
button.onclick = () => void doSomething();

JavaScript URIs (Historical) In older web development patterns, void was heavily utilized within HTML href attributes. It allowed developers to execute JavaScript via an anchor tag without the browser attempting to navigate to a new page or refresh the current one based on a returned value.

<!-- The browser evaluates the JS, receives undefined, and cancels navigation -->
<a href="javascript:void(0)">Click here</a>

Master JavaScript with Deep Grasping Methodology!

Learn More