Understanding Variables and Data Types in JavaScript

Before your app can do anything useful — show your name, calculate a price, check if you're logged in — it needs to store information. That's exactly what variables are for. Let's understand them properly, from scratch.

What is a Variable?

Think of a variable like a labeled box.

You put something inside the box, give it a name, and whenever you need that thing — you just call the name.

let userName = "Subhadip";

Here, userName is the box label. "Subhadip" is what's stored inside. Whenever you need the name, just use userName — no need to type "Subhadip" again and again.

Without variables, your code would look like this:

console.log("Subhadip is 25 years old.");
console.log("Welcome, Subhadip!");
console.log("Subhadip's profile is updated.");

With a variable:

let userName = "Subhadip";
console.log(userName + " is 25 years old.");
console.log("Welcome, " + userName + "!");
console.log(userName + "'s profile is updated.");

Now if the name changes, you update it in one place only. That's the power of variables.

Declaring Variables — var, let, and const

JavaScript gives you three ways to create a variable. Each has its own rules.

let — the modern way to declare variables

Use let when the value might change later.

let age = 25;
console.log(age); // 25

age = 26; // updated!
console.log(age); // 26

const — when the value should never change

Use const for values that are fixed. If you try to change it, JavaScript will throw an error.

const country = "India";
console.log(country); // India

country = "USA"; // ❌ Error: Assignment to constant variable

var — the old way (avoid in modern code)

var was used before let and const existed. It works, but it has some tricky behavior that can cause bugs. Modern JavaScript developers use let and const instead.

var city = "Mumbai";
console.log(city); // Mumbai

Quick comparison:

Simple rule: Use const by default. Switch to let only when you know the value will change. Avoid var.

Data Types — What Can You Store?

Every value in JavaScript has a type. Think of it like the kind of thing inside the box — a name is different from a number, which is different from a yes/no answer.

JavaScript has 5 primitive (basic) data types you'll use every day:

1. String — text

Any text wrapped in quotes.

let firstName = "Rahul";
let greeting = 'Hello, World!';
let message = `Welcome back, ${firstName}`; // template literal

2. Number — numeric values

Both integers and decimals are just number in JavaScript.

let age = 25;
let price = 999.99;
let temperature = -5;

3. Boolean — true or false

Only two possible values. Used for conditions and decisions.

let isLoggedIn = true;
let isStudent = false;
let hasPaid = true;

4. Null — intentionally empty

When you want a variable to exist but have no value on purpose.

let selectedItem = null; // nothing selected yet

5. Undefined — not assigned yet

When a variable is declared but no value has been given to it yet.

let score;
console.log(score); // undefined

The difference between null and undefined:

let a = null;       // you chose to leave it empty
let b;              // you forgot to assign a value
console.log(a);     // null
console.log(b);     // undefined

What is Scope?

Scope answers one question: "Where in my code can I use this variable?"

Imagine your house. Some things are kept in the main hall — everyone in the house can access them. Some things are kept inside your bedroom — only you can access them from in there.

JavaScript works the same way.

Global Scope — available everywhere

let siteName = "MyApp"; // declared outside any block

function showName() {
  console.log(siteName); // ✅ works fine
}

showName();
console.log(siteName); // ✅ works here too

Block Scope — only available inside { }

let and const are block scoped — they only exist inside the {} where they were created.

if (true) {
  let message = "Hello from inside!";
  console.log(message); // ✅ works
}

console.log(message); // ❌ Error: message is not defined

This is why let and const are safer than var — var ignores block scope, which can lead to unexpected bugs:

if (true) {
  var oldVar = "I leak out!";
}
console.log(oldVar); // ✅ works — but this is a problem, not a feature

Putting It All Together

const userName = "Priya";      // string, won't change
let age = 22;                   // number, can change
let isStudent = true;           // boolean
let selectedCourse = null;      // null — nothing chosen yet
let examScore;                  // undefined — not set yet

console.log(userName);          // Priya
console.log(age);               // 22
console.log(isStudent);         // true
console.log(selectedCourse);    // null
console.log(examScore);         // undefined

// Update let — works fine
age = 23;
console.log(age);               // 23

// Update const — throws error
// userName = "Rohit";          // ❌ TypeError

🧪 Your Turn — Assignment Challenge

Try these yourself in your browser console:

1. Declare variables for name, age, isStudent

const name = "Your Name";
let age = 20;
let isStudent = true;

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

2. Try changing let and const

age = 21;           // ✅ works
console.log(age);

name = "New Name";  // ❌ what happens?

3. Check what undefined looks like

let examResult;
console.log(examResult); // what does this print?

Run each block. Read the errors. Understand why they happen — that's the real learning.

Wrapping Up

Variables are how your program remembers things. Data types tell JavaScript what kind of thing is being stored. And scope defines where that information lives.

Master these three concepts and you've built a rock-solid foundation for everything that comes next — functions, loops, objects, all of it uses what you just learned.