What is the most efficient way to deep clone an object in JavaScript?

  1. Home
  2. javascript
  3. What is the most efficient way to deep clone an object in JavaScript?

What is the most efficient way to clone a JavaScript object? I’ve seen obj = eval(uneval(o)); being used, but that’s non-standard and only supported by Firefox.

I’ve done things like obj = JSON.parse(JSON.stringify(o)); but question the efficiency.

I’ve also seen recursive copying functions with various flaws.

I’m surprised no canonical solution exists.

First answer

Native deep cloning

It’s called “structured cloning”, works experimentally in Node 11 and later, and hopefully will land in browsers. See this answer for more details.

Fast cloning with data loss – JSON.parse/stringify

If you do not use Dates, functions, undefined, Infinity, RegExps, Maps, Sets, Blobs, FileLists, ImageDatas, sparse Arrays, Typed Arrays or other complex types within your object, a very simple one liner to deep clone an object is:


const a = {
  string: 'string',
  number: 123,
  bool: false,
  nul: null,
  date: new Date(),  // stringified
  undef: undefined,  // lost
  inf: Infinity,  // forced to 'null'
  re: /.*/,  // lost
console.log(typeof a.date);  // Date object
const clone = JSON.parse(JSON.stringify(a));
console.log(typeof clone.date);  // result of .toISOString()

See Corban’s answer for benchmarks.

Reliable cloning using a library

Since cloning objects is not trivial (complex types, circular references, function etc.), most major libraries provide function to clone objects. Don’t reinvent the wheel – if you’re already using a library, check if it has an object cloning function. For example,


For completeness, note that ES6 offers two shallow copy mechanisms: Object.assign() and the spread operator.

Second answer

Checkout this benchmark: http://jsben.ch/#/bWfk9

In my previous tests where speed was a main concern I found


to be the slowest way to deep clone an object (it is slower than jQuery.extend with deep flag set true by 10-20%).

jQuery.extend is pretty fast when the deep flag is set to false (shallow clone). It is a good option, because it includes some extra logic for type validation and doesn’t copy over undefined properties, etc., but this will also slow you down a little.

If you know the structure of the objects you are trying to clone or can avoid deep nested arrays you can write a simple for (var i in obj) loop to clone your object while checking hasOwnProperty and it will be much much faster than jQuery.

Lastly if you are attempting to clone a known object structure in a hot loop you can get MUCH MUCH MORE PERFORMANCE by simply in-lining the clone procedure and manually constructing the object.

JavaScript trace engines suck at optimizing for..in loops and checking hasOwnProperty will slow you down as well. Manual clone when speed is an absolute must.

var clonedObject = {
  knownProp: obj.knownProp,

Beware using the JSON.parse(JSON.stringify(obj)) method on Date objects – JSON.stringify(new Date()) returns a string representation of the date in ISO format, which JSON.parse() doesn’t convert back to a Date object. See this answer for more details.

Additionally, please note that, in Chrome 65 at least, native cloning is not the way to go. According to this JSPerf, performing native cloning by creating a new function is nearly 800x slower than using JSON.stringify which is incredibly fast all the way across the board.

Update for ES6

If you are using Javascript ES6 try this native method for cloning or shallow copy.

Object.assign({}, obj);

Third answer

Assuming that you have only variables and not any functions in your object, you can just use:

var newObject = JSON.parse(JSON.stringify(oldObject));
Spread the love

Related articles

Comments are closed.