It sounds like a simple thing, right?
“You just do const b = a, don’t you?”
And yet... so many people get this wrong in interviews 😅
Why?
Because in JavaScript, “copying an object” doesn’t always mean what you think it means.
Let’s break it down — like we’re five. 🍪
1️⃣ Copying by reference (aka: it’s not really a copy 😬)
Look at this:
const cat = { name: "Mittens", age: 3 };
const otherCat = cat;
otherCat.age = 5;
console.log(cat.age); // 😿 5
Wait, what?!
We thought we made a new cat,
but both variables point to the same one.
That’s because const b = a doesn’t copy anything — it just says:
“Hey, b is the same object as a.”
That’s called copying by reference.
It’s like having two name tags on the same box 🏷️📦 — different labels, same thing inside.
2️⃣ Spread operator (...) — looks like magic, but it’s only skin-deep 🪄
You’ve probably seen this trick:
const newCat = { ...cat };
And it works! 😻
Changing newCat doesn’t change cat:
newCat.age = 7;
console.log(cat.age); // 🐾 3
Nice! But this is called a shallow copy.
The spread operator only copies the first layer of an object.
Look here:
const cat = {
name: "Mittens",
owner: { name: "Anna" }
};
const newCat = { ...cat };
newCat.owner.name = "Beth";
console.log(cat.owner.name); // 😿 "Beth"
Oops!
That’s because owner is an object inside an object,
and the inner one is still the same reference.
💡 Works the same way with arrays:
const arr = [1, 2, 3];
const newArr = [...arr];
That’s also a shallow copy.
3️⃣ Object.assign() — the old-school shallow copy 🧓
Before the spread operator became cool, people did this:
const newCat = Object.assign({}, cat);
It does the same thing as { ...cat }.
Still a shallow copy — only the top level is copied.
4️⃣ Deep copy — the real new cat 🐱🐱
If you want a true clone, including everything nested inside,
you need a deep copy.
a) Classic way (JSON trick)
const newCat = JSON.parse(JSON.stringify(cat));
✔️ Works great for simple data (strings, numbers, arrays, plain objects)
❌ But it loses functions, dates, undefined, symbols, Map, Set, and so on.
❌ Also fails on circular references:
const cat = {};
cat.friend = cat;
JSON.stringify(cat); // ❌ TypeError: Converting circular structure to JSON
Example of lost data:
const cat = {
birthday: new Date(),
speak: () => "meow"
};
const copy = JSON.parse(JSON.stringify(cat));
console.log(copy);
// { birthday: "2025-10-16T08:00:00.000Z" } — function is gone, date is now a string 😿
b) Modern way: structuredClone() 🚀
In newer JavaScript (browser or Node 17+), you can use:
const newCat = structuredClone(cat);
This one’s 💛 the real deal.
It copies nested data safely and keeps types intact — including Date, Map, Set, ArrayBuffer, Blob, etc.
Example:
const cat = { birthday: new Date(), toys: new Set(["ball", "mouse"]) };
const copy = structuredClone(cat);
console.log(copy.birthday instanceof Date); // ✅ true
console.log(copy.toys.has("ball")); // ✅ true
5️⃣ TL;DR (aka: your interview cheat sheet 😉)
| Method | Type of copy | Works with nested objects? | Notes |
|---|---|---|---|
const b = a |
🔗 Reference | ❌ | Same object |
{ ...a } |
🪞 Shallow | ❌ | Common interview trap |
Object.assign({}, a) |
🪞 Shallow | ❌ | Old-school version of spread |
JSON.parse(JSON.stringify(a)) |
📦 Deep | ✅ | Loses functions, dates, and fails on circular refs |
structuredClone(a) |
🚀 Deep | ✅ | Modern, safe, supports complex types |
✨ Moral of the story
Before you copy an object, ask yourself:
Do I want a new label, or a brand new box? 📦
💬 How about you?
Do you have a favorite way to copy objects?
Ever got caught by this in an interview? 😅
Tell me in the comments!
Top comments (4)
This was a super clear explanation — especially the “new label vs new box” part 😄.
I still remember getting caught by the shallow copy trap in one of my early projects!
structuredClone() is such a lifesaver for modern JS — thanks for explaining it so simply. 🚀
Aww, thank you! 😊
I love hearing that the “new label vs new box” clicked — that’s exactly the image that helped me finally get it too!
And yep, structuredClone() really feels like the hero we didn’t know we needed in JS. 🚀
Very nice thx!
Awww thanks a million 🤩