JavaScript Variables Explained: The Difference Between var, let, and const

When you’re writing JavaScript, declaring variables is one of the first things you’ll do. But not all variable declarations are created equal. JavaScript offers three main keywords for declaring variables: var, let, and const. While they may seem similar at first, they behave very differently — especially when it comes to scope, hoisting, and reassignment.

Let’s break it down clearly so you know which one to use and when.

1. var – The Old-School Variable

The var keyword is the original way of declaring variables in JavaScript. It still works today, but is considered outdated for most use cases.

✅ Features:

• Function-scoped: Accessible throughout the entire function it’s declared in.
• Can be redeclared and updated in the same scope.
• Hoisted to the top of its scope (but only the declaration, not the value).

🧪 Example:

function testVar() {
  var x = 1;
  if (true) {
    var x = 2;
    console.log(x); // 2
  }
  console.log(x); // 2 — same variable, overwritten
}

🔴 Problem: var doesn’t respect block scope, which can lead to confusing bugs in larger applications.

2. let – The Modern, Flexible Option

Introduced in ES6 (ECMAScript 2015), let is now the go-to way for declaring variables that will change later.

✅ Features:

• Block-scoped: Only available inside the {} block it was declared in.
• Can be updated, but not redeclared within the same block.
• Not hoisted like var.

🧪 Example:

function testLet() {
  let x = 1;
  if (true) {
    let x = 2;
    console.log(x); // 2 — new block-scoped variable
  }
  console.log(x); // 1 — outer variable remains unchanged
}

✅ Benefit: Great for controlling scope and avoiding unintended overwrites.

3. const – The Immutable Declaration

Also introduced in ES6, const is used for declaring constants — values that shouldn’t change once set.

✅ Features:

• Block-scoped, like let.
• Cannot be reassigned or redeclared.
• Must be initialized at the time of declaration.

🧪 Example:

const PI = 3.14159;
PI = 3.14; // ❌ Error: Assignment to constant variable

💡 Note: const only prevents reassignment of the variable reference — not the contents of an object or array.

const user = { name: "Alice" };
user.name = "Bob"; // ✅ Allowed (object properties can change)

🔍 Summary Table: var vs let vs const

🧠 When Should You Use Each?

• Use let for most variables — especially when their values may change.
• Use const when the value should never be reassigned.
• Avoid var unless you’re working with old legacy code that depends on it.

🏁 Conclusion

Understanding the difference between var, let, and const is fundamental to writing clean, bug-free JavaScript. While var still works, modern best practices favor let and const for better control over variable scope and safety.

Mastering these keywords helps you avoid subtle bugs and makes your code easier to read, maintain, and scale.