A Pen by Andrew Kirchmyer.

deep-vs-shallow-extension-using-jQuery.extend().markdown

deep vs shallow extension using jQuery.extend()

A Pen by Andrew Kirchmyer on CodePen.

License.

script.js

// three objects with nested data
var app = {
    config: {}
};
app.app_config = {
    one: 1,
    two: 1,
    prefs: {
        one: 1,
        two: 1,
        thisShouldNotBeGone: true
    }
};
app.client_config = {
    two: 2,
    three: 2,
    prefs: {
        two: 2
    },
    overrides: {
        thisShouldBeGone: true,
        three: 2   
    }
};
app.user_config = {
    three: 3,
    overrides: {
        three: 3
    }
};

// Pass in true as the first param to deeply extend. Object property values will be merged between each config with overrides occurring only when two objects have the same property value.
$.extend(true, app.config, app.app_config, app.client_config);

// Here we use a shallow copy. Objects in app.config will be completely replaced by objects in app.user_config rather than being merged.
$.extend(app.config, app.user_config);

console.log(app.config);