Scope & Hoisting

Hoisting is the engine registering declarations before running code, so a name exists in its scope from the top. A var is hoisted and set to undefined, so reading it early yields undefined. A function declaration is hoisted whole, callable before its line; let/const are hoisted but stay uninitialized.

var is function-scoped, hoisted and initialized to undefined, and may be redeclared. let and const are block-scoped and hoisted but left uninitialized until their line (a temporal dead zone before that), and cannot be redeclared in a scope. const also forbids reassigning the binding.

A block is any {} pair — an if, a for, or bare braces. Block scope means a variable is visible only inside the nearest enclosing block. let and const are block-scoped, so they vanish outside the block. var ignores blocks entirely and leaks to the whole enclosing function.

Function scope means a variable is visible everywhere inside the function that declares it, regardless of nested blocks. var is function-scoped: a var declared inside any if or loop is reachable throughout the whole function. Each function call creates a fresh scope for its local variables.

Lexical scope means a name's scope is fixed by where the code is written, not where it runs. A nested function can read variables of its enclosing functions. To resolve a name, the engine walks the scope chain outward — local, then each enclosing scope, then global — stopping at the first match.

The temporal dead zone is the span between entering a scope and the line that initializes a let or const. The name is hoisted and exists in scope, but reading or writing it during the TDZ throws a ReferenceError. var has no TDZ — it reads as undefined before its line instead.

A global variable lives in the top-level scope and is reachable from anywhere in the program. Declaring at the top level makes one deliberately; assigning to a name without var/let/const creates one accidentally — but only in non-strict mode, where strict mode throws a ReferenceError instead.

An execution context is the environment a piece of code runs in, holding its variables, scope chain, and this. It runs in two phases: the creation phase sets up bindings and hoists declarations; the execution phase runs the code line by line. There is one global context plus one per function call.

Shadowing is an inner-scope variable reusing an outer name; inside the inner scope the inner binding wins and the outer is hidden. Illegal shadowing is a SyntaxError when a var collides with a let/const in an overlapping scope, because var leaks out of the block and clashes with the block-scoped name.

An undefined variable is declared but unassigned, so reading it returns undefined. An undeclared variable was never declared anywhere in the scope chain, so reading it throws a ReferenceError (x is not defined). The first is a normal value; the second is a name-lookup failure.

In the creation phase the engine builds the context's environment record: it binds each var to undefined, binds function declarations to their function, and binds let/const names but leaves them uninitialized — the source of the TDZ. It also links the outer environment, forming the scope chain. The execution phase then assigns the real values.

JavaScript is lexically scoped: a function's free variables resolve against the scopes that enclose it in the source, fixed when the function is defined, not when it is called. A name is looked up outward through that lexical chain, and the first (innermost) binding found shadows any same-named outer one. This is also what lets a closure keep its defining scope alive.