jquery - Combining JavaScript Objects into One

Question

I have a function called "Colorbox" (jQuery plugin) that takes a number of parameters like so:

$(this).colorbox({
    width : "500px",
    height : "500px"
});

I have several different types of "this", though, each with their own properties. Like so:

var Type = {
  video: {
    width : "500px",
    height : "500px"
  },
  gallery: {
    width : "1065px",
    height : "600px"
  }
}

Beyond that, I have other behaviors, logic, and a 'default' group of settings (which get overwritten by more specific ones). What I'm trying to do is push all the appropriate settings, from multiple objects, into a single Object so I can just call:

$(this).colorbox(Settings);

How would I transfer an unknown group of properties and their values (for example "width" and "height") from something like Type.video into Settings? The goal is to be able to call Settings.height and get back the value I pushed in.

Answer 1

Take a look at the JQuery extend method. It can merge two objects together and all their properties.

From JQuery's example page:

var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);

Now settings contains the merged settings and options objects.