ReferenceError: x is not defined in JavaScript

ReferenceError: x is not defined in JavaScript

A ReferenceError is thrown when you try to use a variable that does not exist in any accessible scope. The message is "x is not defined," which is confusingly close to undefined.

Common Causes

1. Using a Variable That Was Never Declared

console.log(foo); // ReferenceError: foo is not defined

Fix: Declare it first.

2. Misspelling a Variable Name

const userName = "Kunal";
console.log(userNam); // ReferenceError: userNam is not defined

Fix: Fix the typo.

3. Using a Variable Outside Its Scope

function foo() {
  const inner = 5;
}
console.log(inner); // ReferenceError: inner is not defined

Fix: Declare at the right scope, or return the value.

4. TDZ Access for let/const

console.log(x); // ReferenceError: Cannot access 'x' before initialization
let x = 5;

The message is different ("Cannot access 'x' before initialization"), but it is a ReferenceError. Fix: Declare before use.

5. Forgetting to Import

// module.js
console.log(utils.formatDate()); // ReferenceError: utils is not defined

Fix: import utils from "./utils.js".

The Confusing Message

ReferenceError: x is not defined sounds like "x is undefined," but they are different:

• undefined is a value (the variable exists but has no value).
• not defined means the variable does not exist at all.

Safe Existence Check

typeof does not throw for undeclared variables:

if (typeof someGlobal !== "undefined") {
  someGlobal.doSomething();
}

This is the safe pattern for checking optional globals (e.g., feature detection).

The Takeaway

A ReferenceError: x is not defined means x does not exist in any accessible scope. Common causes: undeclared variables, typos, scope errors, missing imports, and TDZ access. Use typeof for safe existence checks.