Totally basic Javascript reference question

Question

The following in a Javascript console:

var a = {'foo': []};
var b = {};

for (var key in a) {
   b[key] = a[key];
}

a['foo'].push(1);

console.log(b);

Yields:

Object foo=[1]

I want to make a copy by value in b of each array for each key in a. Is there an easier way?

Answer 1

Easier way:

var a = {'foo': []};
var b = a;

a['foo'].push(1);

console.log(b);

Output is the same.

Edit:

var a = {'foo': []};
var b = {};

for (var key in a) {
    if (a.hasOwnProperty(key)) {
        b[key] = [];
        for (var i = 0; i < a[key].length; i += 1) {
            b[key][i] = a[key][i];
        }
    }
}

a['foo'].push(1);

console.log(b);

Answer 2

You could make a "clone" function that creates a new object, based on the original object constructor, and then clone that original object properties also if they are objects:

function clone(obj){
  if(typeof(obj) != 'object' && obj != null) 
    return obj; // return the value itself if isn't an object
                // or null, since typeof  null == 'object';

    var temp = new obj.constructor();

    for(var key in obj)
        temp[key] = clone(obj[key]);
    return temp;
}


var a = {'foo': []};
var b = clone(a);

a['foo'].push(1);

console.log(b); // Object foo=[0]

Answer 3

This is called Deep Copy. You can find examples in:

• http://www.overset.com/2007/07/11/javascript-recursive-object-copy-deep-object-copy-pass-by-value/
• http://stackoverflow.com/questions/565430/javascript-deep-copying-an-array-using-jquery

Answer 4

I think it depends on your library. If you're using Prototype.js, then you can just call toJSON() on the object, and then evalJSON() the result.

//ex:
var foo = {"foo":12, "bar":[ 1, 2, 3 ] };
var bar = foo.toJSON().evalJSON();

alert( bar.bar ); // 1, 2, 3

If you do decide to use a custom function to accomplish this, I would recommend that it has allowances for Arrays, which you can clone using splice(), and other values which don't pass by reference natively (say, Booleans). These may complicate your functions a little, but they turn string look-ups to boolean evaluations. This is a case where more is faster.

Answer 5

As this will add support for deep-copying arrays in your code:

var a = {'foo': []};
var b = {};

for (var key in a) {
   if (Object.prototype.toString.call(b[key]) === "[object Array]") {
      b[key] = a[key].slice(0);
   } else {
      b[key] = a[key];
   }
}

a['foo'].push(1);

console.log(b);