JavaScript Tutorial
Variable declarations control scope, mutation, and runtime behavior. Most beginner and intermediate bugs in JavaScript are caused by incorrect variable usage.
Why this matters
Correct variable semantics reduce hidden bugs, avoid accidental global leaks, and make async behavior easier to reason about.
var is function-scoped and can leak outside block boundaries, while let and const are block-scoped.
Use const as default. Switch to let only when reassignment is required. Avoid var in modern code unless working with legacy behavior.
These rules matter in loops, conditional branches, and closures where variable lifetime impacts output.
All declarations are hoisted, but let and const remain inaccessible before declaration line. This period is called temporal dead zone.
Temporal dead zone prevents accidental usage before initialization and catches logic mistakes early.
if (true) {
var oldWay = "visible outside block";
let modernWay = "only inside block";
}
console.log(oldWay); // works
// console.log(modernWay); // ReferenceErrorvar escapes block, let does not.
const config = { mode: "light" };
config.mode = "dark"; // allowed
console.log(config.mode);
// config = {}; // TypeErrorconst locks binding, not nested object content.
function demo() {
// console.log(total); // ReferenceError
let total = 10;
console.log(total);
}
demo();Accessing let/const before declaration throws runtime error.
Use let so each loop block has predictable scoped values.
Use const by default to prevent accidental reassignment.
Use Object.freeze or immutable update patterns for stricter guarantees.
Use const by default and let when reassignment is required.
var has function scope and hoisting behavior that often causes confusing bugs.
It is the time before let/const declaration where the variable exists but cannot be accessed.
Array contents can be changed, but the variable cannot be reassigned to a new array.