Variables: let, const & var

Variables are named containers for values. JavaScript has three keywords to declare them — let, const and var — and the differences are not cosmetic: they decide how your code behaves when scopes get interesting. This chapter teaches the modern pair first and explains exactly why var is mostly history.

let: a variable that can change

let score = 10;
score = score + 5;      // reassignment is fine
console.log(score);     // → 15

let total = score * 2;  // new name, new variable
console.log(total);     // → 30

const: a binding that cannot be reassigned

const pi = 3.14159;
pi = 3;                 // ❌ TypeError: Assignment to constant variable.

Important nuance: const freezes the binding, not the value. Objects and arrays stay mutable:

const user = { name: 'Asha' };
user.name = 'Ravi';             // ✅ allowed — mutating the object
console.log(user.name);         // → Ravi

user = { name: 'Mira' };        // ❌ TypeError — reassigning the binding

Rule of thumb: start every declaration with const. Switch to let only when you know the value must change (counters, accumulators, reassignment in loops).

var: the legacy keyword

function announce() {
  var message = 'Hi';     // function-scoped, not block-scoped
  if (true) {
    var message = 'Hello'; // same variable — no new scope!
  }
  console.log(message);    // → 'Hello'
}
announce();

var differs from let in three unhelpful ways:

• Function scope — it leaks out of every { } block.
• Hoisting — declared “upstairs”, so it exists as undefined before its line runs (see chapter 12).
• Implicit globals — assigning without declaring creates a global variable by accident.

In modern code you never need it. You will still read it in older libraries.

let vs var: block scope in action

if (true) {
  let a = 1;
  var b = 2;
}
console.log(a);   // ❌ ReferenceError: a is not defined
console.log(b);   // → 2  (b escaped the block 😬)

A “block” is anything inside curly braces — if, for, while bodies. let and const stay inside it; var does not. Full scope mechanics are covered in Scope, Hoisting & Closures.

Naming rules

Use camelCase (totalPrice, isVisible) and names that describe what is stored, not how — minutesLeft, not m.

Declaration, assignment, initialisation

let count;        // declaration (value is undefined)
count = 0;        // assignment
let items = [];   // declaration + initialisation in one line

const-first workflow

const API_URL = 'https://api.example.com';   // never reassigned → const
let attempts = 0;                            // incremented → let
const results = [];                          // array never reassigned → const
results.push('ok');                          // mutation is fine

Expected output: fewer bugs and clearer intent — a reader instantly knows which bindings vary.

Common mistakes

• const “can’t change” myth — you cannot reassign it, but object contents still change; freeze with Object.freeze() if you truly need immutability.
• Mixing var into new code — it silently breaks block scoping.
• Declaring the same variable twice — let throws SyntaxError: Identifier has already been declared.
• Vague names — data and temp tell your future self nothing.

Practice checklist

1. Write a snippet where const reassignment throws — read the exact error message.
2. Compare let and var inside an if block and observe which escapes.
3. Refactor an old snippet: every var → const, then only the true mutables → let.

Variables hold values — but what kinds of values exist? Next: Data Types & Type Coercion.