JavaScript

JavaScript Variables: var, let, and const

6 min read Harshit No comments
JavaScript Variables var let and const

JavaScript variables are used to store data that your program can use and modify. Whether you are building a simple website, a web application, or a backend application with Node.js, understanding JavaScript variables is essential.

JavaScript provides three keywords for declaring variables:

  • var
  • let
  • const

Although all three can be used to create variables, they behave differently. In modern JavaScript, let and const are generally preferred over var.

What Is a Variable in JavaScript?

A variable is a named container used to store a value.

For example:

let name = "Harshit";
let age = 25;

Here:

  • name is a variable containing "Harshit".
  • age is a variable containing 25.

You can use these variables later in your program:

let name = "Harshit";
let age = 25;

console.log(name);
console.log(age);

Output:

Harshit
25

How to Declare a Variable

JavaScript allows you to declare variables using var, let, or const.

var name = "Harshit";

let age = 25;

const country = "India";

The important difference is how these variables behave when you try to change or access them.


1. JavaScript var

var is the older way of declaring variables in JavaScript.

var name = "Harshit";

console.log(name);

Output:

Harshit

You can change the value of a var variable:

var age = 25;

age = 26;

console.log(age);

Output:

26

You can also redeclare a var variable:

var name = "Harshit";

var name = "Rahul";

console.log(name);

Output:

Rahul

This behavior can sometimes cause unexpected bugs.

Problem with var

Consider:

var message = "Hello";

if (true) {
    var message = "Hi";
}

console.log(message);

Output:

Hi

The variable declared inside the if block is not limited to that block because var is function-scoped, not block-scoped.


2. JavaScript let

let was introduced with ES6 (ECMAScript 2015).

It is commonly used when you need a variable whose value can change.

let age = 25;

age = 26;

console.log(age);

Output:

26

Unlike var, you cannot redeclare the same let variable in the same scope.

let name = "Harshit";

let name = "Rahul";

This produces an error.

let Is Block Scoped

A variable declared using let exists only inside the block where it is declared.

let message = "Hello";

if (true) {
    let message = "Hi";
    console.log(message);
}

console.log(message);

Output:

Hi
Hello

The two message variables are separate because let is block-scoped.


3. JavaScript const

const is used when you don’t want to reassign a variable after its initial value.

const country = "India";

console.log(country);

You cannot assign a new value to it:

const country = "India";

country = "USA";

This results in a TypeError.

A const variable must also be initialized when it is declared:

const name;

This is invalid.

You need to write:

const name = "Harshit";

const Is Block Scoped

Like let, const is block-scoped.

const website = "harshitsharma.dev";

if (true) {
    const website = "example.com";
    console.log(website);
}

console.log(website);

Output:

example.com
harshitsharma.dev

Difference Between var, let, and const

Featurevarletconst
ScopeFunctionBlockBlock
Can reassign?YesYesNo
Can redeclare?YesNoNo
Must initialize?NoNoYes
Modern JavaScriptAvoid when possibleYesYes

var vs let

The biggest differences are scope and redeclaration.

Using var

var x = 10;

if (true) {
    var x = 20;
}

console.log(x);

Output:

20

Using let

let x = 10;

if (true) {
    let x = 20;
}

console.log(x);

Output:

10

This is because let respects block scope.


let vs const

Both let and const are block-scoped.

The main difference is reassignment.

let

let score = 10;

score = 20;

console.log(score);

This is valid.

const

const score = 10;

score = 20;

This is not valid because a const variable cannot be reassigned.


Can You Change a const Object?

This is an important JavaScript concept.

Consider:

const user = {
    name: "Harshit",
    age: 25
};

You cannot assign a completely new object:

user = {
    name: "Rahul",
    age: 30
};

But you can modify properties of the existing object:

user.name = "Rahul";
user.age = 30;

console.log(user);

Output:

{
    name: "Rahul",
    age: 30
}

Why?

Because const prevents reassignment of the variable, not modification of the object referenced by that variable.

The same concept applies to arrays:

const fruits = ["Apple", "Banana"];

fruits.push("Mango");

console.log(fruits);

Output:

["Apple", "Banana", "Mango"]

But this is not allowed:

fruits = ["Orange"];

Variable Naming Rules

JavaScript variables have some naming rules.

Valid variable names

let name = "Harshit";
let userName = "Harshit";
let age2 = 25;
let _username = "Harshit";
let $price = 100;

Invalid variable names

let 2name = "Harshit";
let user-name = "Harshit";

Variable names cannot start with a number and cannot contain a hyphen.

JavaScript variable names are also case-sensitive:

let name = "Harshit";
let Name = "Rahul";

console.log(name);
console.log(Name);

These are two different variables.


JavaScript Variable Naming Best Practices

Use meaningful names:

let userName = "Harshit";
let userAge = 25;
let productPrice = 500;

Avoid unclear names:

let x = "Harshit";
let a = 25;
let p = 500;

For multiple words, JavaScript developers commonly use camelCase:

let firstName = "Harshit";
let lastName = "Sharma";
let totalAmount = 5000;

Constants that represent application-wide fixed values are sometimes written in uppercase:

const API_URL = "https://example.com/api";
const MAX_USERS = 100;

This is a convention, not a JavaScript requirement.


Which One Should You Use?

For modern JavaScript, a good default is:

Use const by default. Use let when the value needs to change. Avoid var in new code unless you specifically need its older behavior.

For example:

const name = "Harshit";
const country = "India";

let age = 25;

age = 26;

Here, name and country don’t need reassignment, so const is appropriate.

age can change, so let is appropriate.


Common Mistakes

Mistake 1: Reassigning const

const price = 100;

price = 200;

Use let if reassignment is required:

let price = 100;

price = 200;

Mistake 2: Redeclaring let

let name = "Harshit";
let name = "Rahul";

Instead:

let name = "Harshit";

name = "Rahul";

Mistake 3: Using var everywhere

Older JavaScript code often contains:

var name = "Harshit";
var age = 25;

Modern code generally uses:

const name = "Harshit";
let age = 25;

This gives you better control over scope and reassignment.


Quick Summary

JavaScript provides three variable declaration keywords:

  • var — older, function-scoped, can be redeclared and reassigned.
  • let — block-scoped and can be reassigned.
  • const — block-scoped and cannot be reassigned.

A simple rule to remember is:

const → default choice
let   → value needs to change
var   → generally avoid in modern JavaScript

Understanding var, let, and const is one of the first important steps in learning JavaScript. Once you understand variables, you can move on to data types, operators, conditions, loops, and functions.


Practice

Try to predict the output before running these examples:

let x = 10;
x = 20;

console.log(x);
const name = "Harshit";

console.log(name);

And:

var message = "Hello";

if (true) {
    var message = "Hi";
}

console.log(message);

These small exercises will help you understand the difference between reassignment, redeclaration, and scope.

Leave a comment

Your email address will not be published.