When I first started writing JavaScript, I treated all variables the same way. A variable holds a value, simple, right? It wasn't until I started digging deeper into how JavaScript actually works under the hood that I realised there's a fundamental difference between how primitives and objects are stored in memory. And that difference has real consequences in your code.
What are primitives? Primitives are the basic data types in JavaScript: strings, numbers, booleans, null, undefined, and symbols. When you assign a primitive to a variable and then copy it to another variable, JavaScript creates a completely independent copy of that value.
let a = 5;
let b = a;
let b = a;
b = 10;
console.log(a); // 5 — unchanged
console.log(b); // 10
Changing b has absolutely no effect on a. They are two separate values in memory. This behaviour is called copy by value.
What about objects? Objects: including arrays and functions behave differently. When you assign an object to a variable, JavaScript doesn't store the object itself in the variable. It stores a reference, a pointer to where that object lives in memory. This means if you copy an object to another variable, both variables point to the same object in memory.
let user1 = { name: "Alice" };
let user2 = user1;
let user2 = user1;
user2.name = "Bob";
console.log(user1.name); // "Bob" — not "Alice"!
This is called copy by reference. You didn't create a new object, you just created a second pointer to the same one. Modifying it through user2 also changes what user1 sees, because they're looking at the same place in memory.
Why does this matter in practice? This distinction becomes especially important when passing objects into functions. If you pass an object to a function and modify it inside, you're modifying the original, not a copy.
function updateName(obj) {
obj.name = "Updated";
obj.name = "Updated";
}
const person = { name: "Original" };
updateName(person);
console.log(person.name); // "Updated"
For a developer coming from a background where variables feel like simple containers, this can be the source of very subtle and frustrating bugs.
The takeaway Understanding copy by value vs copy by reference is one of those concepts that quietly sits behind a lot of JavaScript behaviour. Once it clicks, you start reading code differently, you notice when something might be mutating shared state, and you make more deliberate decisions about when to copy an object versus reference it. It's a small concept with a big impact on how you write clean, predictable code.