If you're new to JavaScript or trying to strengthen your foundations, one of the first confusing things you’ll encounter is the difference between let
, const
, and var
. They all declare variables, but the way they behave under the hood is quite different—and understanding them can save you from some tricky bugs down the road.
Let’s break it down in a way that actually sticks.
The Evolution of Variable Declarations
Back in the early days of JavaScript, there was only var
. It did the job—but not without quirks. As JavaScript evolved, developers needed more control and predictability. Enter let
and const
, introduced in ES6 (2015). These newer keywords offer better scoping and help prevent unintentional errors.
1. var
: The Old-School Way
-
Function Scoped:
var
is scoped to the function in which it's declared. If it's declared outside of any function, it becomes globally scoped. -
Hoisting: Variables declared with
var
are hoisted to the top of their scope—but only the declaration, not the value.
console.log(a); // undefined
var a = 10;
You don’t get an error above because the declaration var a
is hoisted. But since the value 10
hasn’t been assigned yet, you get undefined
.
- Redeclaration is Allowed:
var a = 5;
var a = 10; // No error
This can lead to confusion and bugs, especially in large codebases.
2. let
: The Modern and Safer Option
-
Block Scoped: Unlike
var
,let
is scoped to the block ({}
) in which it’s defined.
{
let x = 20;
}
console.log(x); // ReferenceError
This keeps your variables more localized and avoids accidental overwriting.
-
Hoisting, But Not Usable Before Declaration: Technically,
let
is hoisted, but it's in a "temporal dead zone" until the line where it's defined.
console.log(x); // ReferenceError
let x = 10;
- No Redeclaration in the Same Scope:
let y = 10;
let y = 20; // SyntaxError
This helps you catch mistakes early.
3. const
: Lock the Variable
-
Block Scoped: Like
let
,const
is also block scoped. - Must Be Initialized: You have to assign a value when you declare it.
const z; // SyntaxError
-
Cannot Be Reassigned: Once a
const
is assigned, you can’t reassign it.
const pi = 3.14;
pi = 3.1415; // TypeError
But note: if the value is an object or array, the contents can still be changed!
const arr = [1, 2, 3];
arr.push(4); // This works
arr = [5, 6]; // TypeError
So, Which One Should You Use?
Here’s a good rule of thumb:
- Use
const
by default. - Use
let
only when you know the value will change. - Avoid
var
unless you’re working with legacy code.
This pattern leads to more readable and predictable code. It makes your intent clear: const
means “I don’t want this value to change,” and let
means “this might change later.”
Final Thoughts
Understanding the difference between let
, const
, and var
isn’t just about knowing syntax. It’s about writing safer, cleaner, and more maintainable JavaScript. These keywords might look small, but they carry powerful behavior that affects your entire program.
Take the time to experiment, read errors carefully, and notice the patterns. As your skills grow, you'll start making these decisions almost automatically—and that’s when you know you’re leveling up as a developer.
Have questions about where to use let
or const
? Ask away in the comments—let’s learn together!
Top comments (1)
Some comments may only be visible to logged-in visitors. Sign in to view all comments.