Cloning an Object (v99)

Revision 99 of this benchmark created on

Description

There is no quick and easy facility for cloning an object, Some people recommend using JQuery.extend others JSON.parse/stringify

http://stackoverflow.com/questions/122102/what-is-the-most-efficient-way-to-clone-a-javascript-object

If you want the fastest possible clone function. I would personally anticipate the data structure of your object and write a custom clone to handle it.

Preparation HTML

<script src="http://code.jquery.com/jquery-1.5.1.js" type="text/javascript"></script>


<script>
/*
   Description: Performs JSON-safe deep cloning. Equivalent of JSON.parse(JSON.stringify()).
   Based on deepClone7() by Kyle Simpson (https://github.com/getify)
   Source: http://jsperf.com/deep-cloning-of-objects,
   http://jsperf.com/structured-clone-objects/2
   https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/The_structured_clone_algorithm
   */

  function deepCopy(objToBeCopied) {
    if (objToBeCopied === null || !(objToBeCopied instanceof Object)) {
      return objToBeCopied;
    }
    var copiedObj, fConstr = objToBeCopied.constructor;
    copiedObj = new fConstr();
    for (var sProp in objToBeCopied) {
      if (objToBeCopied.hasOwnProperty(sProp)) {
        copiedObj[sProp] = deepCopy(objToBeCopied[sProp]);
      }
    }
    return copiedObj;
  }

  var oldObject = {
   a: 1,
   b: 2,
   c: 3,
   d: 4,
   e: 5,
   f: {foo: "Bar", baz: "BART"},
   g: [7, 8, 9]
  };
  
  
  function clone(obj) {
   var target = {};
   for (var i in obj) {
    if (obj.hasOwnProperty(i)) {
     target[i] = obj[i];
    }
   }
   return target;
  }
  function clone2 (obj) {
    return Object.keys(obj).reduce(function(c,k){c[k]=obj[k];return c;},{})
  }
  
  Object.defineProperties(Object, {
   'extend': {
    'configurable': true,
    'enumerable': false,
    'value': function extend(what, wit) {
     var extObj, witKeys = Object.keys(wit);
  
     extObj = Object.keys(what).length ? Object.clone(what) : {};
  
     witKeys.forEach(function(key) {
      Object.defineProperty(extObj, key, Object.getOwnPropertyDescriptor(wit, key));
     });
  
     return extObj;
    },
    'writable': true
   },
   'clone': {
    'configurable': true,
    'enumerable': false,
    'value': function clone(obj) {
     return Object.extend({}, obj);
    },
    'writable': true
   }
  });
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
JQuery.extend deep
var newObject = jQuery.extend(true, {}, oldObject);
ready
JSON
var newObject = JSON.parse(JSON.stringify(oldObject));
ready
JQuery.extend
var newObject = jQuery.extend({}, oldObject);
ready
simple clone function
var newObject = clone(oldObject);
ready
ES5 Object.clone
var newObject = Object.clone(oldObject);
ready
clone2
var newObject = clone2(oldObject);
ready
deepCopy
var newObject = deepCopy(oldObject);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.