Comments on: Deep copying of Objects and Arrays

By: Luke

Luke — Mon, 27 Apr 2009 18:15:50 +0000

Unfortunately, deep copying a complex structure can be much more complicated than this, depending on the level of uniqueness and precision you need from the original vs the copy. A few examples: objects storing DOM elements, maintaining prototype relationships to protect instanceof, and using functions as namespaces.

On a more focused note, the final function doesn’t account for null, which is (sadly) typeof ‘object’. Also, you can use for..in for both arrays and objects.

function deepCopy(o) {
    var copy = o,k;
 
    if (o && typeof o === 'object') {
        copy = Object.prototype.toString.call(o) === '[object Array]' ? [] : {};
        for (k in o) {
            copy[k] = deepCopy(o[k]);
        }
    }
 
    return copy;
}

This will handle sparse arrays and cases of arrays treated as objects (e.g. var a = []; a.dontDoThis = ‘you should use an Object’)

By: James

James — Thu, 23 Apr 2009 07:08:56 +0000

@Strx, functions are quite tricky. Like regular objects, functions exist in memory and when you assign one to a variable you’re giving it a pointer, and every time you assign a function to a new variable all you’re doing is creating a new pointer to the same function.

Functions generally don’t contain data or anything unique for that matter, so there’s nothing to copy; their functionality cannot be changed in any way once the function has been created. So you can essentially copy a function (although not really “copy”) just by re-assigning it to a different variable:

var fn = function(){
    alert(5);
};
 
var fn2 = fn;
// Even though fn === fn2 it doesn't matter because
// a function cannot be changed.
// All you can do with a function is run it.

But note that, because functions are objects, unique properties can be added and if that happens then you have to treat it like a regular object when copying.

By: Strx

Strx — Thu, 23 Apr 2009 06:20:28 +0000

In the article you refer to Functions as complex types, but in the deepCopy they are not referenced. Why? How are functions copied?

Thanks for your posts, always useful.

By: James

James — Wed, 22 Apr 2009 16:04:52 +0000

@Ben, in some respects JavaScript does pass by value; I think there’s a lot of confusion; I thought it was pass-by-reference but apparently calling it that is misleading: http://javadude.com/articles/passbyvalue.htm (Even though the article is about Java it applies to JavaScript). If you try “The Litmus Test” in JavaScript you’ll see it doesn’t pass. The author claims it’s better to say that “Object references are passed by value” instead of “Objects are passed by reference”.

Thanks for your comment!

By: Ben Nadel

Ben Nadel — Wed, 22 Apr 2009 14:18:12 +0000

I’ve been coding in ColdFusion for so long, I totally forgot that arrays are passed by reference in Javascript. ColdFusion passes them by value. Thanks for the reminder and the cool post!

On a side note, I’ve noticed that you always use arguments.callee rather than ever referring to the name of the function. I like your style – low coupling. Good stuff.