Javascript: deep cloning object methods

Deep cloning in JavaScript has always been a headache. From JSON.parse(JSON.stringify()) breaking on functions, to libraries like lodash.cloneDeep() We've had to rely on workarounds.

But now, JavaScript has a built-in deep cloning method —meet structuredClone()!

What is structuredClone()?

It's a native deep-cloning function that copies objects without breaking data types! Unlike JSON.stringify(), it:

• Supports functions, Maps, Sets, Dates, TypedArrays
• Handles circular references 🚀
• Works natively in modern browsers & Node.js (v17+)!

Old vs New: Deep Cloning in Action

Using JSON.stringify - Broken Cloning

const obj = {
  date: new Date(),
  func: () => "Hello",
};
 
const cloned = JSON.parse(JSON.stringify(obj));
 
console.log(cloned.date instanceof Date); // ❌ false (Broken)
console.log(cloned.func); // ❌ undefined (Functions are lost!)

Using structuredClone() - Works Perfectly!

const obj = {
  date: new Date(),
  func: () => "Hello",
};
const cloned = structuredClone(obj);
 
console.log(cloned.date instanceof Date); // ✅ true
console.log(cloned.func); // ❌ Still not cloned (Functions aren't serializable)

Why is structuredClone() a Game-Changer?

• No More Manual Workarounds - Forget third-party libraries!
• Handles Circular References - JSON.stringify() crashes, but structuredClone() doesn't!
• Built-In Performance Boost - Uses optimized browser internals.

Bonus: Cloning Objects with Circular References

const obj = {};
obj.self = obj;
 
JSON.parse(JSON.stringify(obj)); // ❌ ERROR: Circular structure!

This makes deep cloning much safer & more reliable!

const obj = {};
obj.self = obj;
 
const cloned = structuredClone(obj); // ✅ Works perfectly!
console.log(cloned.self === cloned); // true

Final Takeaway

The only problem with the “structuredClone” function is that it doesn't clone an objects functions. Apart from that, it's very useful