Search lands in PR-5.1 (Pagefind).
Explanation Beginner

Chapter 7 Updated

let, const, Temporal Dead Zone, Block Scope & Shadowing

The modern declarations, their scoping rules, and the three errors they produce.

  • Full 15m
  • Revision 3m
  • Flow 2m

var vs let vs const

The one-card comparison.

  • var — function scope, hoisted as undefined, on window, re-declare ✓, re-assign ✓.
  • let — block scope, hoisted into TDZ, Script scope (not on window), re-declare ✗, re-assign ✓.
  • const — block scope, hoisted into TDZ, Script scope, re-declare ✗, re-assign ✗, must init at declaration.
  • Rule of thumb: const > let > avoid var.

The Temporal Dead Zone

Hoisted, but unreachable.

  • TDZ = period from scope entry until the let/const declaration line runs.
  • Any access inside TDZ throws ReferenceError: Cannot access 'x' before initialization.
  • The message itself proves let/const ARE hoisted — if not, error would say is not defined.
  • Even typeof x throws in TDZ — unlike undeclared variables, where typeof safely returns "undefined".
  • Shrink TDZ to zero: declare + initialize at the top of each scope.

Memory spaces

Where each declaration actually lives.

  • Global — where top-level var lives, attached to window.
  • Script — where top-level let / const live, NOT on window.
  • Block — where block-level let / const live; destroyed when the { } closes.
  • Local — function’s own memory. DevTools’ Scope panel shows all four separately.

const is not immutable

The binding is frozen, not the value.

  • const prevents reassigning the binding, not mutating the object.
  • const obj = { a: 1 }; obj.a = 2; → fine. obj = {} → TypeError.
  • const arr = [1,2]; arr.push(3); → fine. arr = [4] → TypeError.
  • For true immutability use Object.freeze() — and remember it’s shallow.

Block scope & shadowing

Why var and let behave so differently.

  • let / const in { } create a new Block-scope binding — outer variable untouched.
  • var in { } is the same variable as outer — block assignment overwrites global memory.
  • Illegal shadowing: let a = …; { var a = …; } → SyntaxError (var tries to live in the same scope).
  • Legal: var shadowing let inside a function (function scope boundary isolates it).

Three error types

Which error fires at which stage.

  • SyntaxError — code never runs. Duplicate let, missing const initializer.
  • ReferenceError — runtime. TDZ access, or reading an undeclared identifier.
  • TypeError — runtime. Reassigning a const, calling undefined().
  • var + setTimeout loop → all callbacks see final i; swap to let → each iteration gets its own.

Comments

Comments are disabled in this environment. Set PUBLIC_GISCUS_REPO, PUBLIC_GISCUS_REPO_ID, and PUBLIC_GISCUS_CATEGORY_ID to enable.