Skip to main content

Command Palette

Search for a command to run...

Understanding Variables and Data Types in JavaScript (Beginner Friendly Guide)

JavaScript Variables and Data Types Explained with Simple Examples

Updated
5 min read
Understanding Variables and Data Types in JavaScript (Beginner Friendly Guide)
D
I’m a Computer Science Engineer focused on backend development, scalable system design, and real-world production deployments. I build and deploy full-stack applications using Node.js, Express, MongoDB, Redis, Docker, and CI/CD pipelines.

1. Imagine You Are Running a Small Office

Think about your desk.

On your desk you keep boxes. Each box stores some information.

For example:

  • One box stores your name

  • One box stores your age

  • One box stores whether you are a student

Each box has:

  1. A label (to identify it)

  2. A value inside

In programming, these boxes are called VARIABLES.

Real Life Example

Box Label Value Inside
Name Deepansh
Age 22
IsStudent true

In JavaScript we create these boxes like this:

let name = "Deepansh";
let age = 22;
let isStudent = true;

Here:

  • name → variable label

  • "Deepansh" → value stored inside

  • = → means “store this value”

So logically:

A variable is simply a named container used to store data.


2. Why Do We Need Variables?

Imagine building a login system.

A user enters:

  • name

  • email

  • password

Where will the program store these values?

Inside variables.

Example:

let username = "Deepansh";
let email = "deepansh@gmail.com";
let password = "123456";

Now the program can use this data anywhere.

Example:

console.log(username);

Output

Deepansh

Without variables, the program cannot remember information.

So think of variables as memory containers.


3. How JavaScript Creates Variables

JavaScript gives three keywords to create variables.

var
let
const

Each one creates a container, but their rules are different.


4. var (The Old Way)

var was used in older JavaScript.

Example:

var city = "Delhi";

You can change the value.

var city = "Delhi";

city = "Mumbai";

console.log(city);

Output

Mumbai

The problem with var is it ignores block boundaries, which caused bugs.

So modern JavaScript developers avoid var.


5. let (Modern Variable)

let is the recommended way to create variables whose values can change.

Example

let score = 50;

score = 80;

console.log(score);

Output

80

This means the value inside the box can change.

Real life analogy:

You have a box labeled score.

You can replace the number inside anytime.


6. const (Constant Variable)

const means constant.

The value cannot change.

Example:

const country = "India";

console.log(country);

Output

India

If you try to change it:

const country = "India";

country = "USA";

JavaScript will throw an error.

Why?

Because a const box is sealed.

Real life analogy:

A permanent label engraved on metal.

It cannot be edited.


7. Primitive Data Types

Now imagine something important.

A box can store different kinds of data.

For example:

  • text

  • numbers

  • true/false

  • empty value

JavaScript categorizes them as DATA TYPES.


8. String (Text Data)

Strings store text information.

Examples:

  • name

  • email

  • city

  • message

Example:

let name = "Deepansh";
let city = "Moradabad";

Strings are always written inside:

" "
' '

9. Number

Numbers store numeric values.

Example:

let age = 22;
let price = 499;
let temperature = 35.5;

Numbers can be:

  • integers

  • decimals

JavaScript does not separate them.


10. Boolean

Boolean represents true or false.

Example situations:

  • Is user logged in?

  • Is payment successful?

  • Is student active?

Example:

let isLoggedIn = true;
let isAdmin = false;

Only two values exist.

true
false

11. Undefined

Sometimes we create a variable but don't assign a value yet.

Example:

let username;

console.log(username);

Output

undefined

Meaning:

The variable exists, but nothing is stored inside.


12. Null

null means:

The value is intentionally empty.

Example:

let selectedUser = null;

Meaning:

The program is saying:

“Right now no user is selected.”

So the difference is:

Type Meaning
undefined value not assigned
null intentionally empty

13. Basic Difference Between var, let, const

Feature var let const
Modern JS ❌ No ✅ Yes ✅ Yes
Value change allowed ✅ Yes ✅ Yes ❌ No
Block scope ❌ No ✅ Yes ✅ Yes
Recommended ❌ Avoid ✅ Use ✅ Use

So in modern development:

Use let for changing values
Use const for fixed values
Avoid var

14. Understanding Scope (Very Simple)

Imagine a house with rooms.

Each room has its own boxes.

Boxes inside a room cannot be accessed outside the room.

Example:

{
    let message = "Hello";
}

console.log(message);

This will cause an error.

Why?

Because the variable was created inside the block.

Visual Idea

Room (Block)

   message = "Hello"

Outside room → cannot access message

This concept is called SCOPE.

Definition:

Scope defines where a variable can be accessed in a program.


15. Small Assignment Example

Create three variables.

let name = "Deepansh";
let age = 22;
let isStudent = true;

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

Output

Deepansh
22
true

Now try changing values

let age = 22;
age = 25;

Works perfectly.

But:

const country = "India";
country = "USA";

Error.

Because const values cannot change.