Script SpringsISSUE #6 of 29

hoisting · what runs before what

SparkyVSNaN the Trickster

Sparky saysHoisting moves declarations to the top of their scope — but let/const stay in a "temporal dead zone".

JS processes declarations before running code. var is hoisted and initialized as undefined; function declarations are fully hoisted (callable before their line). let/const are hoisted too but unusable until declared — the "temporal dead zone" — so referencing them early throws. This is another reason to prefer let/const.

Power-ups you unlock

Declarations are processed before execution
var hoists as undefined; functions hoist fully
let/const exist but throw if used early (TDZ)
Declare before use to avoid surprises

NaN the Trickster attacks — common mistakes

Using a var before assignment and getting undefined
Calling a function expression before it’s defined
Assuming let behaves like var

Boss battleShow a function declaration called before its definition, and a let accessed too early (in your head: it throws).

Example code

<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><pre id="o"></pre>
<script>document.getElementById('o').textContent = greet(); // works — hoisted
function greet(){ return 'function declarations hoist fully'; }</script></body></html>

▶ Open the interactive comic issue

‹ Variables · Var · Let · Const Data Types · Primitives Vs Objects ›