JSFiddle - React, Tailwind, and code Playground

HTML

<pre id="out"></pre>

JavaScript

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")
        },
    }
};

var object3 = {
    requests: {
        main: {
            data: {
                test: true
            }
        },
        otherFunction: function () {
            console.log("foobar")
        },
    }
};

function extend(o1, o2, o3) {
    
    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;
}


Function.prototype.toJSON = Function.prototype.toString;
out.innerHTML = JSON.stringify(extend(object1, object2, object3), null, 4);