How to merge complex JS objects

Question

How can I merge two (or more) JS objects like this?

The result should contain all functions (like showUser and showOtherData) and events and requests-arrays should be merged as well.

var object1 = {
  events: {
    'app.activated': 'showUser'
  },
  requests: {
  },
  showUser: function() {
    console.log("es jhsod")
  },
};

var object2 = {
  events: {
    'app.destroyed': 'hideUser'
  },

  requests: {
    main: {
      url: 'http://example/api/main',
      data: {
        format: 'json'  
      }
    }
  },

  showOtherData: function() {
    console.log("foobar")
  },
};

possible duplicate of How can I merge properties of two JavaScript objects dynamically? — AeroX
– AeroX, Commented Feb 26, 2015 at 11:46

dfsq · Accepted Answer · 2015-02-26 12:00:35Z

3

I know there are already some implementations, but this is so much fun to write recursive functions. Check this one more extend function for your problem. It also supports unlimited number of arguments:

function extend() {

    var result = {}, obj;

    for (var i = 0; i < arguments.length; i++) {
        obj = arguments[i];
        for (var key in obj) {
            if (Object.prototype.toString.call(obj[key]) === '[object Object]') {
                if (typeof result[key] === 'undefined') {
                    result[key] = {};
                }
                result[key] = extend(result[key], obj[key]);
            } 
            else {
                result[key] = obj[key];
            }
        }
    }
    return result;
}

console.log(extend(object1, object2, object3));

Demos: http://jsfiddle.net/zgbwtp4g/, http://jsfiddle.net/zgbwtp4g/1

edited Feb 26, 2015 at 12:00

answered Feb 26, 2015 at 11:55

dfsq

193k26 gold badges244 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Hedge Over a year ago

That is an awesome function. Thank you very much :)

skay- · Accepted Answer · 2015-02-26 11:46:34Z

1

There is no easy way but there are various implementation online stemming from different libraries, i.e lodash merge or jquery extend. You can see the implementation of those and implement it yourself.

This seems to show a nice implementation: merge

answered Feb 26, 2015 at 11:46

skay-

1,5863 gold badges17 silver badges26 bronze badges

Collectives™ on Stack Overflow

How to merge complex JS objects

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related