Developer Toolkit

Deep Clone Generator

Generate a ready-to-use JS deep clone utility using structuredClone with a recursive fallback, plus example usage.

Controls

Function name

Test data (JSON)

Live preview

{
  "name": "config",
  "nested": {
    "list": [
      1,
      2,
      {
        "deep": true
      }
    ]
  },
  "created": "2024-01-01"
}

// New reference: yes

Generated JavaScript

export function deepClone(value) {
  if (typeof structuredClone === "function") {
    try {
      return structuredClone(value);
    } catch (err) {
      // Falls through to the recursive clone (e.g. functions, DOM nodes).
    }
  }

  return cloneRecursive(value, new WeakMap());
}

function cloneRecursive(value, seen) {
  if (value === null || typeof value !== "object") return value;
  if (seen.has(value)) return seen.get(value);

  if (value instanceof Date) return new Date(value.getTime());
  if (value instanceof RegExp) return new RegExp(value.source, value.flags);

  if (value instanceof Map) {
    const map = new Map();
    seen.set(value, map);
    value.forEach((v, k) => map.set(cloneRecursive(k, seen), cloneRecursive(v, seen)));
    return map;
  }

  if (value instanceof Set) {
    const set = new Set();
    seen.set(value, set);
    value.forEach((v) => set.add(cloneRecursive(v, seen)));
    return set;
  }

  if (Array.isArray(value)) {
    const arr = [];
    seen.set(value, arr);
    for (let i = 0; i < value.length; i++) arr[i] = cloneRecursive(value[i], seen);
    return arr;
  }

  const out = Object.create(Object.getPrototypeOf(value));
  seen.set(value, out);
  for (const key of Object.keys(value)) {
    out[key] = cloneRecursive(value[key], seen);
  }
  return out;
}

// Example usage
const original = { user: { name: "Ada", tags: ["admin"] } };
const copy = deepClone(original);
copy.user.tags.push("editor");
console.log(original.user.tags); // ["admin"] — untouched
console.log(copy.user.tags);     // ["admin", "editor"]