JavaScript Scope Isn't Magic — It's a Lookup Rule You Can Debug in Five Questions

Scope bugs are among the most common runtime errors in JavaScript and are notoriously hard to spot when `var`, `let`, and `const` mix in a codebase. Understanding the temporal dead zone and block-scoping rules directly prevents the `ReferenceError` that stops a page from loading or breaks a module in production.

JavaScript engines parse code into an AST before execution, establishing where every variable lives. That structure determines whether a `console.log` succeeds or throws a `ReferenceError`. Three scope types govern access: global, function, and block. Function scope walls off variables declared inside a function, regardless of how many times that function is called. Block scope, introduced by `let` and `const`, confines variables to curly braces — a boundary `var` ignores entirely.

Hoisting lifts `var` declarations but not their assignments, producing `undefined` instead of the expected value. `let` and `const` hoist differently: the engine reserves the name for the entire block but forbids access before the declaration line, a window called the temporal dead zone. That dead zone also means an inner `let` shadows an outer variable immediately upon entering the block, not at the declaration line, so a read before `let a = 10` fails even when an outer `a` exists.

A five-question checklist cuts through the confusion: where is the variable declared, where is the code using it, which keyword declared it, is there a same-name variable in the current scope, and has initialization finished. Answering those questions resolves nearly every `is not defined` and `cannot access before initialization` error.