How do you combine two objects in Javascript?

Question

Possible Duplicate:
How can I merge properties of two JavaScript objects dynamically?

If I have two Javascript objects which I am using as a list of key-value pairs:

var a = {a:1};
var b = {b:2};

what is the most efficient way to combine them into a third object which contains the properties of both?

var c = {a:1, b:2};

I don't mind if either or both of a and b are modified in the process.

If a property contains another object or an array, do you want a new copy or a reference to that property in the new object? — jfriend00, Jun 22 '12 at 16:36
var a = {a:1, c:4}; var b = {b:2, f:9, d:4}; var c = combine(a, b); function combine(array1, array2) { for (key in array2) { array1[key] = array2[key]; } return array1 } — Tarun, Jun 22 '12 at 16:42
@Alison: Look at the top of your question: http://stackoverflow.com/questions/171251/how-can-i-merge-properties-of-two-javascript-objects-dynamically — Felix Kling, Jun 22 '12 at 16:44

Denys Séguret · Answer 1 · 2012-06-22T16:45:03.797

4

You can do simply this :

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

If you want to do a deep merging (assuming you don't want to copy the functions and prototypes), you can use this :

  function goclone(source) {
        if (Object.prototype.toString.call(source)==='[object Array]') {
            var clone = [];
            for (var i=0; i<source.length; i++) {
                if (source[i]) clone[i] = goclone(source[i]);
            }
            return clone;
        } else if (typeof(source)=="object") {
            var clone = {};
            for (var prop in source) {
                if (source[prop]) {
                    var firstChar = prop.charAt(0);
                    clone[prop] = goclone(source[prop]);
                }
            }
            return clone;
        } else {
            return source;
        }
    }


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

But frankly I never saw the use for a deep merging in javascript...

edited Jun 22 '12 at 16:45

answered Jun 22 '12 at 16:30

Denys Séguret

372,613
87
782
758

This will only work for primitive data types. Any object type will only be referenced. – Joseph Silber Jun 22 '12 at 16:32
1

Copying even non enumerable properties? Not taking into account nested objects? Oh, come on! :-) – Florian Margaine Jun 22 '12 at 16:32
1

Deep cloning if different from cloning... – Denys Séguret Jun 22 '12 at 16:36
1

No one said anything about deep copies... – Felix Kling Jun 22 '12 at 16:36
@JosephSilber: It still works with reference types. You're assuming a reference to the same object is not desired. – Jun 22 '12 at 16:37
1

Why those downvotes ? Deep copying is rarely needed and wasn't requested. Even deep cloning is rare... – Denys Séguret Jun 22 '12 at 16:38
Now with deep merging... – Denys Séguret Jun 22 '12 at 16:40
2

@dystroy - What is `$.isArray`? Are you using jQuery? Then just use `$.extend`, and be over and done with... – Joseph Silber Jun 22 '12 at 16:42
Making a isArray is easy... I'll add it. edit : done. – Denys Séguret Jun 22 '12 at 16:44
Or you can copy jQuery's source and be done with it, seeing how much code you've written (it's almost as much as jQuery's extend). – Florian Margaine Jun 22 '12 at 16:44
I've put a lot of code because somebody wasn't satisfied with OP's question and required deep merge. – Denys Séguret Jun 22 '12 at 16:45
@FlorianMargaine - Copying jQuery's source is an option, but you'll have to hunt down all of jQuery's other functions being used in there. Here's a **great** tool for that: http://james.padolsey.com/jquery/#v=git&fn=extend - ring me up when you're done. – Joseph Silber Jun 22 '12 at 16:52
Still not using `hasOwnProperty` :/ @JosephSilber yeah I was hesitating whether I'd put this code here or not – Florian Margaine Jun 22 '12 at 16:53
1

Please, people asking for deep cloning or speaking of hasOwnProperty, just read the question *"If I have two Javascript objects which I am using as a list of key-value pairs:"*. – Denys Séguret Jun 22 '12 at 16:59
var c= $.extend({}, a, b); – Gyanesh Gouraw Nov 27 '14 at 09:39

How do you combine two objects in Javascript?

1 Answers1