Understanding Variables and Data Types in JavaScript
When we meet someone new, what's the first thing we remember about them ? Their name. Maybe their age. Whether they're a student or working somewhere. We're storing information in our brain without even thinking about it.
That's exactly what variables do in JavaScript. They store information so our program can remember and use it later.
What is a Variable, and Why Do We Need It?
Think of a variable like a labelled box. We write a name on the outside of the box, and put a value inside it. Whenever we need that value, we just refer to the box by its name.
Without variables, a program would have no memory at all. We couldn't save a user's name, track a score in a game, or remember whether someone is logged in. Variables are what make code actually useful.
let playerName = "Gurjeet";
// The box called "playerName" now holds "Gurjeet"
console.log(playerName); // Output: Gurjeet
How to Declare Variables: var, let, and const
JavaScript gives us three keywords to create a variable. Think of them as three different types of boxes. Each one has slightly different rules.
var — the old way
var was the original way to declare variables in JavaScript. It still works, but it has some quirky behaviour that can lead to confusing bugs in bigger codebases. Most modern JavaScript code avoids it.
var city = "Amritsar";
city = "Delhi"; // works fine, value gets updated
let — for values that change
let is what we reach for when the value might need to change later. A score that updates as the game goes on, or a user's current status, that kind of thing.
let score = 0;
score = 10; // updated after the player earns points
const — for values that stay fixed
const is short for constant. Once we assign a value to it, we cannot replace it. The app's name, a base URL, a tax rate, anything that is not supposed to change during the program.
const appName = "MyApp";
appName = "OtherApp"; // Error! Cannot reassign a const
A good rule to follow: default to const. If we know the value will need to change at some point, switch to let. And for now, just leave var alone.
Primitive Data Types
Every value we store in a variable has a type. JavaScript has five basic types that we will work with constantly, and they are called primitive data types.
String is for text. Any time we are dealing with words, names, or sentences, we wrap the value in quotes and it becomes a string.
let name = "Gurjeet"; // String
Number covers any numeric value, whether it is a whole number or a decimal.
let age = 22; // whole number
let price = 3.99; // decimal
Boolean can only ever be true or false. Think of it as a yes/no switch.
let isStudent = true;
let hasSubscription = false;
Null means the box is intentionally empty. We are the ones who put nothing there on purpose.
let phoneNumber = null; // we know it's empty
Undefined means the box exists but nobody told it what to hold yet.
let address; // no value assigned, so it's undefined
The difference between null and undefined trips almost everyone up at first. Here is the simplest way to think about it: nullmeans "I know this is empty." undefined means "nobody even got around to filling this in yet." Small difference, but it matters once we start debugging real code.
let name = "Gurjeet"; // String
let age = 22; // Number
let isStudent = true; // Boolean
let phone = null; // Null, intentionally empty
let address; // Undefined, not assigned yet
var vs let vs const
The biggest practical difference comes down to two things: can the value be changed, and where in the code can the variable be accessed.
var can be reassigned and even re-declared, which sounds flexible but is actually what causes the bugs. let can be reassigned but not re-declared. const cannot be reassigned or re-declared at all.
The other difference is scope, which we are about to get into.
What is Scope?
Scope answers one question: where in our code can a particular variable be accessed?
Here is a simple way to picture it. Think of our house. Whatever is inside our bedroom, like a personal diary, stays in our bedroom. Someone in the kitchen cannot just reach in and grab it. But something in the living room, like the television, is accessible to everyone in the house.
Variables work the same way. A variable declared inside a block of code, anything wrapped in { }, can only be accessed within that block. That is called block scope, and it is the rule that both let and const follow.
let outsideVar = "I am outside";
{
let insideVar = "I am inside the block";
console.log(outsideVar); // works fine
console.log(insideVar); // works fine
}
console.log(outsideVar); // works fine
console.log(insideVar); // Error, insideVar doesn't exist out here
This is exactly why var causes confusion. It does not respect block scope the same way. It leaks out of blocks, which means it can be accessed from places we never intended. That is a bug waiting to happen.
