Search for a command to run...
Learn how JavaScript variables work, including let vs const, primitive and reference types, pass by value, and how JavaScript stores data in memory.
Co-Founder, @CreoWis | Teacher, @tapaScript | Founder, @ReactPlay | YouTuber | Writer | Human
Really appreciate how you broke down the difference between primitive and reference types — that 'copying a reference vs copying a value' distinction trips up so many developers.
I've been building a financial tracking app (IndexedDB-based, runs entirely in the browser) and ran into a subtle bug where I was mutating an object I thought I'd cloned. Turned out I was just copying the reference. A simple structuredClone() fixed it, but it cost me hours of debugging.
Question: when you're teaching this concept, do you find students grasp it better with memory diagrams (boxes and arrows) or through live mutation examples in the console? Curious because I've seen both approaches and wonder which sticks better.
Welcome to the 40 Days of JavaScript series! 🚀 There are 101 ways of learning something. But nothing can beat the “structured” and “progressive” learning methodologies. I have designed this playlist for you to stay structured and motivated. 💪🏼
A beginner-friendly introduction to JavaScript covering what it is, how it works, and how to set up your JavaScript environment
Traditional SSR is great, but it has a massive buffering problem. Let's look into the SSR Streaming and learn how it could be a game changer.
Learn how to build maintainable, reusable forms in React using design patterns like custom hooks, compound components, and context for scalable CRUD
A beginner-friendly introduction to JavaScript covering what it is, how it works, and how to set up your JavaScript environment
Learn how the promises are handled internally using event loop. This concept is essentials to debug and work with async programming.
GreenRoots Blog - A Blog by Tapas Adhikary
186 posts
Educator | YouTuber | Building ReactPlay | Let's Connect
Day 02 of 40 Days of JavaScript is where JavaScript starts to feel real. Today’s focus is on variables, how values are stored, and why JavaScript behaves the way it does when data changes.
If variables are not clear, everything that follows—functions, objects, React state, debugging—will feel confusing. So the goal here is not speed, but clarity.
If you skipped Day 01, it’s strongly recommended to complete it first. This lesson assumes your environment is already set up.
In this session, we explore what variables are, how assignment works, how JavaScript treats primitive and non-primitive values, and why let, const, and var behave differently. We also introduce memory concepts that explain many “weird” JavaScript behaviours developers face later.
If you prefer learning visually, this video guides you through every concept step by step, featuring live coding and demos.
A variable is a named storage location.
Think of it as writing your friend’s address on a piece of paper. The paper is the variable. The address written on it is the value. You carry the paper so you can reuse the information later.
In JavaScript, variables allow us to store and reuse data.
let city = "Bangalore";
Here, city is the storage, and Bangalore is the value inside it.
Modern JavaScript provides three keywords for declaring variables.
var age = 30;
let name = "Tapas";
const country = "India";
The difference between them is not in syntax but in behaviour.
var allows redeclaration.
let allows reassignment but not redeclaration.
const allows neither redeclaration nor reassignment.
Understanding this difference early prevents many bugs later.
Assignment means putting a value into a variable. Reassignment means replacing the old value with a new one.
let fruit = "Mango";
fruit = "Kiwi";
The variable fruit still exists, but the value inside it has changed. The old value is replaced.
With var, redeclaration is allowed.
var address = "Bangalore";
var address = "USA";
console.log(address); // USA
This behaviour caused confusion and bugs for years because the same variable could be declared multiple times without warning.
That’s why modern JavaScript prefers let and const.
let Fixes the ProblemWith let, redeclaration is not allowed, but reassignment is.
let address = "Bangalore";
address = "USA";
console.log(address); // USA
Trying to redeclare it results in an error.
let address = "Bangalore";
let address = "USA"; // Error
This forces cleaner, more predictable code.
const Existsconst is used when a variable should never change.
const pi = 3.14;
pi = 3.14159; // Error
This is extremely useful for values that must remain stable, such as configuration values or fixed references.
Primitive values are the most basic data types.
let userName = "Alex"; // string
let age = 25; // number
let isStudent = true; // boolean
let salary; // undefined
let bonus = null; // null
Primitive values are passed by value.
let a = 10;
let b = a;
b = 20;
console.log(a); // 10
console.log(b); // 20
Here, b receives a copy of a. Changing b does not affect a.
If a variable is declared but not assigned, it is undefined.
let score;
console.log(score); // undefined
If a variable is explicitly assigned null, it means “no value intentionally”.
let score = null;
console.log(score); // null
This distinction becomes critical when working with APIs and conditions.
Objects and arrays are non-primitive values.
let student = {
name: "Alice",
age: 22,
enrolled: true
};
let numbers = [1, 2, 3, 4];
These values are stored in memory, and variables hold a reference to them.
let user1 = { name: "Sam" };
let user2 = user1;
user2.name = "Alex";
console.log(user1.name); // Alex
Both variables point to the same object. This behavior surprises many developers and is the foundation of bugs in real applications if not understood.
JavaScript stores data in memory.
Primitive values are stored directly in stack memory.
Non-primitive values are stored in heap memory, and variables store references to them.
You don’t need to master memory management yet, but knowing this difference explains why reference values behave differently.
JavaScript enforces grammar rules.
Variable names:
• Must start with a letter, underscore, or dollar sign
• Cannot start with a number
• Cannot use reserved keywords
• Are case-sensitive
Valid examples:
let _count = 10;
let $price = 99;
let userName = "Tapas";
Invalid examples:
let 2day = "Monday"; // invalid
let user-name = "Sam"; // invalid
let for = 10; // invalid
Beyond rules, naming should be meaningful and readable. A variable name should explain its purpose without comments.
All code demonstrated in this session is available in the GitHub repository linked below.
✅ Task 1: Declare variables for a person’s name, age, isStudent status, and favorite programming language.
✅ Task 2: Print the values to the console.
✅ Task 3: Try reassigning values to let and const variables and observe errors.
✅ Task 4: Create an object and an array, assign them to new variables, modify, and observe changes.
In Day 03, we’ll explore operators and expressions, building directly on variables and values.
Let’s build JavaScript confidence. One solid step at a time 🚀
Liked it? Please let me know with your comments and likes. ❤️
Let's connect: