Script SpringsISSUE #5 of 29

variables · var · let · const

SparkyVSNaN the Trickster

Sparky saysDeclare variables with let (reassignable), const (fixed binding), or the legacy var.

Prefer const by default and let when you must reassign. Both are block-scoped. The old var is function-scoped and hoists in surprising ways — avoid it. const fixes the binding, not the contents: a const object can still have its properties mutated.

Power-ups you unlock

const by default, let when reassigning
Both are block-scoped
Avoid var (function-scoped, quirky hoisting)
const fixes the binding, not object contents

NaN the Trickster attacks — common mistakes

Using var out of habit
Thinking const makes objects immutable (it doesn’t)
Reassigning a const (throws TypeError)

Boss battleDeclare a const object, mutate a property (allowed), then try reassigning it (error).

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>const user={name:'drew'}; user.name='drewless'; // mutation OK
let count=1; count=2;        // reassignment OK
document.getElementById('o').textContent = JSON.stringify(user)+' · count='+count;</script></body></html>

▶ Open the interactive comic issue

‹ Comments · Single · Multi · Jsdoc Hoisting · What Runs Before What ›