Stop 04 · JavaScriptTopics · 1/36

Variables

Part of the Frontend Developer Roadmap

In short

Every app remembers things: your name, your cart, your score. Variables are the labelled boxes where JavaScript keeps them, and picking the right kind saves you from weird bugs later.

`var`, `let` and `const` declare storage for values — each with different scoping and reassignment rules that trip up nearly every JS beginner. In modern JavaScript, `const` and `let` are usually preferred because block scoping makes variable lifetime easier to reason about and reduces accidental reassignment.

The jaadu mascot sticks name labels on food boxes inside a hostel fridge.

Think of it like this

Name stickers in the hostel fridge

Everyone sticks their name on their stuff in the hostel fridge. const is a sticker glued to one box for good. let is a sticker you can peel off and put on another box. var is the old sticker that falls off and ends up everywhere.

Watch it happen

const or let?

const

  • Name always points to the same value
  • Reassigning throws a TypeError
  • Objects inside can still change

let

  • Can be pointed at a new value
  • Lives only inside its { } block
  • Use for counters and running totals

Start with const. Switch to let only when you really reassign the name.

The big ideas

What you need to know

Start with const

Use const by default. It means this name will always point to the same value, which makes code easier to trust.

Use let when it changes

Counters, totals, anything you reassign later. let lives only inside the curly braces where you declared it.

Skip var

var ignores block braces and is hoisted in confusing ways. You'll see it in old code, but don't write new code with it.

const is not frozen

A const object or array can still change inside. Only the name can't be pointed at something new.

See it in code

Walk through the code

js
1const college = "IIT Delhi";2let semester = 1;3semester = 2;              // fine, let can be reassigned4 5// college = "NIT Trichy"; // TypeError: Assignment to constant variable.6 7const student = { name: "Aman" };8student.name = "Aman K";   // allowed, it's still the same object9console.log(student.name); // "Aman K"

1/3college is fixed with const. semester uses let, so changing it from 1 to 2 is allowed.

const stops you from reassigning the name, not from changing what's inside an object. If you truly want a locked object, use Object.freeze(student).

Save yourself the pain

Common mistakes

Oops

Using let for everything, just in case it changes someday.

Do this instead

Use const first. Switch to let only when you actually reassign. Readers then know which values move.

Oops

Thinking a const array can never change.

Do this instead

push, pop and edits still work on a const array. const only blocks writing marks = somethingElse.

Your mission

Sort the stickers

~10 min

Quick check

What does this log? const marks = [90]; marks.push(80); console.log(marks.length);

Go deeper

  1. 1Compare `var` vs `let` scoping by logging a variable inside and outside a block. Write down when you would choose each option and what trade-off drives that choice.
  2. 2Default to `const`, use `let` only when reassignment is needed, avoid `var`. Know the exception cases as well, so you can make the choice deliberately.
  3. 3Learn the 'temporal dead zone' that `let`/`const` introduce.

More topics at this stop

Stuck on this topic? Ask an Insider

Get 1:1 guidance from people who've walked this exact path — on the InsideEdge app.

Download
InsideEdge