Data #1 — Deep Clone & Deep Compare

{...obj} and [...arr] give you shallow copies — nested objects are still shared references. Deep cloning makes a completely independent copy. Deep comparison checks if two values are structurally identical. This article implements both, handling all the tricky edge cases.

Prerequisites: Recursion Patterns

1. The Problem with Shallow Copying

structuredClone() is the modern native solution (Node 17+, browsers 2022+), but implementing it manually teaches you every edge case.

2. Deep Clone — Handling Primitives, Arrays, Objects

3. Deep Equality — deepEquals(a, b)

Structural equality checks if two values have the same "shape" and values — recursively. Unlike ===, it handles objects, arrays, and edge cases like NaN and +0/-0:

4. Object.is() — The Built-in Strict Comparison

Object.is() is like === with two fixes:

5. structuredClone() — The Modern Native Solution

If you're targeting modern browsers, structuredClone handles most cases:

Key Takeaways

• Shallow copy (..., Object.assign) only copies top-level properties — nested objects are shared.
• Deep clone recursively copies every level — use seen Map to handle circular references.
• Handle special types: Date (via getTime()), RegExp (via source/flags), Map, Set.
• structuredClone() is the best option for modern targets — but can't clone functions or DOM nodes.
• Deep equality needs NaN === NaN and +0 ≠ -0 handling, plus circular ref detection.
• Always use a seen Map for circular reference handling in both clone and equals.

Next: Data #2 — Flatten & Unflatten Objects — convert nested objects to flat key paths and back.