Cloning an Object (v105)

Revision 105 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="//code.jquery.com/jquery-git2.js"></script>

Setup

var oldObject = {
       a: 1,
       b: 2,
       c: 3,
       d: 4,
       e: 5,
       f: function() {
        return 6;
       },
       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) {
       var target = {};
       var keys = Object.keys(obj);
       for (var i = 0, len = keys.length; i < len; i++) {
         target[keys[i]] = obj[keys[i]];
       }
       return target;
      }
     
      function clone3(obj) {
       var target = {};
       for (var key in obj) {
         target[key] = obj[key];
       }
       return target;
      }
     
      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
       }
      });
    
      function cloneStupid(obj) {
          var target = [ obj ];
          return target.slice(0);
      }

Teardown


    newObject.a = -911;
    console.log("after: " + oldObject + " and new: " + newObject);

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 = clone2(oldObject);
ready
simple clone function
var newObject = clone(oldObject);
ready
ES5 Object.clone
var newObject = clone3(oldObject);
ready
Stupid Clone
var newObject = cloneStupid(oldObject);
ready

Revisions

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