Back to all snippets
Library/JavaScript/Deep Clone Object
javascriptintermediateobjectsutilitiescloning

How to implement Deep Clone Object in Javascript

Create a deep copy of an object with nested properties

Quick Answer

Deep cloning creates a fully independent copy of a JavaScript object, including all nested objects and arrays, so mutations to the clone do not affect the original.

Code Snippet

1function deepClone(obj) {
2  if (obj === null || typeof obj !== 'object') return obj;
3  if (obj instanceof Date) return new Date(obj.getTime());
4  if (obj instanceof Array) return obj.map(item => deepClone(item));
5  if (obj instanceof Object) {
6    const clonedObj = {};
7    for (const key in obj) {
8      if (obj.hasOwnProperty(key)) {
9        clonedObj[key] = deepClone(obj[key]);
10      }
11    }
12    return clonedObj;
13  }
14}

What is Deep Clone Object?

Deep cloning creates a completely independent copy of an object, including all nested objects and arrays. This prevents unintended mutations when working with complex data structures. Unlike shallow copying with the spread operator or Object.assign, deep cloning recursively copies all levels of nested properties.

How It Works

  1. 1Primitive values and null are returned as-is.
  2. 2Date instances are copied by constructing a new Date from getTime().
  3. 3Arrays are mapped recursively so each element is also deep-cloned.
  4. 4Plain objects are iterated with a for-in loop and each own property is deep-cloned.
  5. 5The result is a completely new object with no shared references to the original.

Common Use Cases

  • State management — create immutable copies in Redux or React state
  • Form data handling — work with form copies without affecting originals
  • Configuration objects — clone settings for different environments
  • Data manipulation — transform data without side effects

Key Benefits

  • Prevents unintended object mutations
  • Handles nested objects, arrays, and dates
  • Essential for immutable data patterns
  • Avoids reference-related bugs

Common Mistakes to Avoid

  • Using JSON.parse(JSON.stringify(obj)) — this drops undefined values, functions, and Date objects become strings.
  • Using the spread operator for nested objects — it only creates a shallow copy.
  • Not handling circular references — this recursive version will overflow the stack if cycles exist.
  • Cloning class instances — the result is a plain object, not an instance of the original class.

Quick Tips

  • Click the "Copy" button above to copy the code to your clipboard
  • This code is production-ready and can be used in your projects immediately
  • Check out related snippets below for more javascript examples

Frequently Asked Questions

Why not use JSON.parse(JSON.stringify()) to deep clone?

It loses undefined properties, converts Date objects to strings, and throws on values that are not JSON-serialisable such as functions or BigInt.

Does structuredClone work in modern browsers?

Yes. structuredClone() is now available in all major browsers and Node 17+. It handles more types than JSON but does not copy functions or class prototypes.

How do I handle circular references in a deep clone?

Keep a WeakMap of already-visited objects and return the existing clone if the same reference is encountered again.

Related Snippets

javascript
beginner
Get Unique Array Values
Remove duplicate values from an array
arraysutilities
javascript
intermediate
Local Storage Helper
Type-safe localStorage wrapper with JSON support and error handling
storageutilitiesbrowser

About This Javascript Code Snippet

This free javascript code snippet for deep clone object is production-ready and copy-paste friendly. Whether you are building a web app, API, or frontend interface, this intermediate-level example will help you implement deep clone object quickly and correctly.

All snippets in the Snippetly library follow javascript best practices and are tested for real-world use. You can adapt this code to work with React, Vue, Node.js, or any project that uses javascript.

Tags: objects, utilities, cloning  | Language: javascript  | Difficulty: intermediate  | Category: JavaScript

Build Your Own Snippet Library

Organise your team's code snippets with Snippetly. Share knowledge and boost productivity across your organisation.

Get Started FreeBrowse More Snippets