Variables, let, const, and var: What's the Real Difference
· 4 min read
In the last lesson we got JavaScript running in the browser.
In the last lesson we got JavaScript running in the browser. Now we need somewhere to store the data our code works with — numbers, text, results of calculations — and that's what variables are for. JavaScript gives you three keywords to create a variable: var, let, and const. Picking the right one is not just a style choice; it changes how your code behaves and prevents entire categories of bugs.
Using Const By Default
Start with const, because it should be your default choice. const creates a variable whose reference cannot be reassigned after it's set.
const siteName = "Vikesh Singh's Blog";
siteName = "Something else";
That second line throws a TypeError: Assignment to constant variable. That error is a feature, not an annoyance — it means if you later try to accidentally overwrite siteName somewhere else in a long file, JavaScript stops you immediately instead of letting a silent bug slip through.
A beginner trap: people think const means "the values inside this can never change." That's only true for primitive values like strings and numbers. For objects and arrays, const locks the variable binding, not the contents.
const user = { name: "Tony Stark", alias: "Iron Man" };
user.alias = "Mark VII";
console.log(user.alias);
This works fine and prints "Mark VII", because we never reassigned the variable user itself — we only changed a property inside the object it points to. Only user = { ... } on its own would fail.
When To Use Let
Use let when you genuinely need to reassign a variable later, such as a counter or a value that changes as your program runs.
let score = 0;
score = score + 10;
score += 5;
console.log(score);
Why Var Causes Problems
Now, why avoid var? var has two behaviors that cause real bugs: it's function-scoped instead of block-scoped, and it allows "hoisting" in a confusing way. Block scope means a variable only exists inside the { } it was declared in — an if block, a for loop, a function. var ignores that and leaks out of blocks.
if (true) {
var oldStyle = "I leak out";
let modernStyle = "I stay inside";
}
console.log(oldStyle);
console.log(modernStyle);
The first console.log prints "I leak out" just fine, because var ignored the if block's boundaries. The second line throws a ReferenceError, because let respected the block and the variable doesn't exist out here. That containment is exactly what you want in real code — it stops a variable named i or result in one part of your program from accidentally colliding with a same-named variable somewhere else.
var is still found in a lot of older code and tutorials, which is why it's worth recognizing, but there is essentially no reason to write it in new code today. let and const cover every case.
One practical tip: when you're not sure whether to use let or const, write const first. If your editor or the browser later complains that you're reassigning it, that's your signal to switch to let — this habit naturally pushes you toward fewer mutable variables, which makes code easier to reason about.
There's also a subtler reason let and const matter beyond scoping: they prevent accidental redeclaration. With var, declaring the same variable name twice in the same scope is silently allowed and just overwrites the first one, which can hide a real bug where you meant to create a second, different variable. With let or const, declaring the same name twice in the same scope throws a SyntaxError immediately — JavaScript catches your mistake for you, before the code even runs, rather than letting it fail silently somewhere downstream.
Reading Variable Error Messages
A final practical habit worth building now: read error messages for const and let carefully, since they tell you exactly what went wrong rather than leaving you guessing. "Assignment to constant variable" means you reassigned a const. "Cannot access 'x' before initialization" means you used a let or const variable before its own declaration line ran. Both are the language actively protecting you from a class of bugs that var would have let slide through silently, which is worth appreciating rather than finding annoying.
It's also worth noting that function and class declarations are hoisted differently from let and const, a detail the next lesson on functions will cover properly. For now, the safe general rule is: declare every variable with let or const at the top of the block where you first need it, and don't rely on being able to use it before that line runs. This single habit avoids almost every hoisting-related surprise you'd otherwise run into while this course moves on to functions, loops, and closures.
To make this stick, try this: declare a const for a value that never changes (like a name or a fixed number) and a let for something that will update in a small loop. Try reassigning the const on purpose just to see the exact error message — recognizing that message instantly will save you time for the rest of this course.
KEEP READING