July 31, 20267 min readAdmin User

JavaScript Variables: A Beginner-Friendly Guide to var, let, and const

Learn JavaScript variables with beginner-friendly examples. Understand the difference between var, let, and const, along with naming rules, scope, data types, common mistakes, and best practices.

Web DevelopmentJavaScriptJavaScript VariablesvarletconstJavaScript for BeginnersJavaScript TutorialProgramming BasicsFrontend DevelopmentWeb Development
JavaScript Variables: A Beginner-Friendly Guide to var, let, and const

JavaScript variables are used to store information that can be accessed, updated, and reused inside a program.

A variable can store different types of values, such as a person’s name, age, product price, email address, or login status.


let userName = "Rahul";
let age = 24;
let isLoggedIn = true;

In this example:

  • userName stores text.
  • age stores a number.
  • isLoggedIn stores a Boolean value.

You can think of a variable as a labelled container. The variable name is the label, and the stored information is the value inside it.

What Is a Variable?

A variable is a named container used to store data.

Instead of writing the same value repeatedly, we can save it in a variable and use the variable name whenever it is required.

Without a variable:


console.log("Delhi");
console.log("Delhi");
console.log("Delhi");

Using a variable:


let city = "Delhi";

console.log(city);
console.log(city);
console.log(city);

The second example is cleaner and easier to update.

When the city changes, you only need to change its value once.


city = "Mumbai";

How to Declare a Variable in JavaScript

JavaScript provides three keywords for declaring variables:


var
let
const

Modern JavaScript mainly uses let and const.

Using let

The let keyword is used when the value may change later.


let score = 10;

score = 20;

console.log(score);

Output:


20

The variable initially stored 10, but its value was later updated to 20.

Another example:


let userStatus = "Offline";

userStatus = "Online";

console.log(userStatus);

Use let when you expect the value to change.

Using const

The const keyword is used when the variable should not be reassigned.


const country = "India";

console.log(country);

The following code will produce an error:


const country = "India";

country = "Canada";

A const variable must also receive a value when it is declared.

Incorrect:


const userName;

Correct:


const userName = "Aman";

Use const for values that should remain the same.


const websiteName = "Tech Blog";
const birthYear = 2000;
const pi = 3.14;

In modern JavaScript, developers usually use const by default and choose let only when the value needs to change.

Using var

The var keyword is the older method of declaring variables.


var message = "Hello JavaScript";

console.log(message);

Although var still works, it is generally avoided in modern JavaScript because its scope and behaviour can create confusion.

A beginner-friendly rule is:


Use const by default.
Use let when the value changes.
Avoid var in modern JavaScript.

Difference Between var, let, and const

FeaturevarletconstCan be reassignedYesYesNoCan be redeclaredYesNoNoBlock scopedNoYesYesRecommended todayNoYesYes

Example using var:


var name = "Aman";
var name = "Rahul";

This works because var allows redeclaration.

However, the following code produces an error:


let name = "Aman";
let name = "Rahul";

A variable created with let cannot be declared twice in the same scope.

The same rule applies to const.

Declaring and Assigning Variables

Creating a variable is called declaration.


let age;

Giving a value to the variable is called assignment.


age = 25;

You can declare and assign a variable in one line:


let age = 25;

Updating a Variable

Variables created with let can be updated.


let productPrice = 500;

productPrice = 650;

console.log(productPrice);

Output:


650

You should not write let again while updating the variable.

Incorrect:


let productPrice = 500;
let productPrice = 650;

Correct:


let productPrice = 500;
productPrice = 650;

Variable Naming Rules

JavaScript variable names must follow certain rules.

A variable name can contain:

  • Letters
  • Numbers
  • Underscores
  • Dollar signs

Examples:


let userName = "Aman";
let user1 = "Rahul";
let user_age = 25;
let $price = 499;

A variable name cannot start with a number.

Incorrect:


let 1user = "Aman";

Correct:


let user1 = "Aman";

Variable names cannot contain spaces.

Incorrect:


let user name = "Rahul";

Correct:


let userName = "Rahul";

JavaScript reserved words cannot be used as variable names.

Incorrect:


let function = "Test";
let const = "Value";

Words such as function, let, const, and return already have special meanings in JavaScript.

JavaScript Is Case-Sensitive

JavaScript treats uppercase and lowercase letters differently.


let userName = "Aman";
let username = "Rahul";

These are two different variables.


console.log(userName);
console.log(username);

Output:


Aman
Rahul

Use consistent naming to prevent unnecessary errors.

Use Meaningful Variable Names

Variable names should clearly describe the stored information.

Bad example:


let x = "Mohit";
let y = 25;
let z = true;

Better example:


let userName = "Mohit";
let userAge = 25;
let isActive = true;

Meaningful variable names make code easier to read, understand, and maintain.

Camel Case Naming Convention

JavaScript developers commonly use camel case for variable names.

In camel case, the first word starts with a lowercase letter, while every additional word begins with an uppercase letter.

Examples:


let firstName = "Aman";
let sellingPrice = 599;
let isUserLoggedIn = true;
let totalOrderAmount = 1500;

Camel case is widely used because it makes variable names easier to read.

Variables Can Store Different Data Types

Variables can store many types of data.

String


const userName = "Rahul";

Number


let age = 24;

Boolean


let isStudent = true;

Array


const skills = ["HTML", "CSS", "JavaScript"];

Object


const user = {
  name: "Rahul",
  age: 24,
  city: "Delhi"
};

JavaScript automatically identifies the data type based on the assigned value.

Checking a Variable’s Data Type

The typeof operator is used to check a value’s type.


const userName = "Rahul";
const age = 24;
const isDeveloper = true;

console.log(typeof userName);
console.log(typeof age);
console.log(typeof isDeveloper);

Output:


string
number
boolean

Variable Scope

Scope determines where a variable can be accessed.

Global Scope

A variable created outside a function or block can usually be accessed from different parts of the program.


const websiteName = "My Blog";

function showWebsite() {
  console.log(websiteName);
}

showWebsite();

Block Scope

Variables created with let and const inside curly braces can only be accessed within that block.


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

The following code will produce an error:


if (true) {
  let message = "Hello";
}

console.log(message);

The message variable only exists inside the if block.

Common Beginner Mistakes

Reassigning a const Variable

Incorrect:


const age = 20;
age = 21;

Correct:


let age = 20;
age = 21;

Use let when the value needs to change.

Declaring the Same let Variable Twice

Incorrect:


let city = "Delhi";
let city = "Mumbai";

Correct:


let city = "Delhi";
city = "Mumbai";

Using a Variable Before Declaration

Incorrect:


console.log(userName);

let userName = "Aman";

Correct:


let userName = "Aman";

console.log(userName);

Using Unclear Names

Avoid:


let a = 500;
let b = 2;
let c = a * b;

Use:


let productPrice = 500;
let quantity = 2;
let totalPrice = productPrice * quantity;

Clear variable names make debugging much easier.

Practical JavaScript Variable Example


const productName = "JavaScript Book";
let productPrice = 499;
let quantity = 2;

const totalPrice = productPrice * quantity;

console.log("Product:", productName);
console.log("Price:", productPrice);
console.log("Quantity:", quantity);
console.log("Total:", totalPrice);

Output:


Product: JavaScript Book
Price: 499
Quantity: 2
Total: 998

This example uses:

  • const for values that should not be reassigned
  • let for values that may change
  • Meaningful variable names
  • A calculation using stored values

Best Practices

Follow these practices while working with variables:

  • Use const by default.
  • Use let when the value needs to change.
  • Avoid var in modern JavaScript.
  • Use camel case for variable names.
  • Use meaningful and descriptive names.
  • Declare variables before using them.
  • Avoid creating unnecessary global variables.
  • Keep naming consistent throughout the project.

Practice Questions

Try these exercises:

  1. Create a variable for your name and print it.
  2. Store your age using let, and then update it.
  3. Create a constant for your country.
  4. Store a product price and quantity, then calculate the total.
  5. Create variables containing a string, number, and Boolean.
  6. Use typeof to check the data type of each variable.
  7. Create an object containing a user’s name, age, and city.
  8. Create an array containing three programming languages.

Do not only read the examples. Write the code, run it, make mistakes, and fix them. That is where real programming skills are built.

Conclusion

Variables are the foundation of JavaScript programming. They allow developers to store, update, calculate, and reuse information throughout an application.

JavaScript provides var, let, and const, but modern development mainly uses let and const.

Remember:


Use const when the value should not be reassigned.
Use let when the value may change.
Avoid var in modern JavaScript.

Once you understand variables, the next important topic to learn is JavaScript data types.