将JavaScript对象合二为一

Question

我有一个名为"Colorbox"(jQuery插件)的函数,它接受了许多参数,如下所示:

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

不过,我有几种不同类型的"this",每种都有自己的属性.像这样:

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

除此之外,我还有其他行为,逻辑和"默认"设置组(被更具体的设置覆盖).我要做的是将所有适当的设置从多个对象推送到一个Object中,这样我就可以调用:

$(this).colorbox(Settings);

如何将未知的属性组及其值(例如"width"和"height")从Type.video转移到Settings？目标是能够调用Settings.height并获取我推送的值.

Answer 1

看一下JQuery 扩展方法.它可以合并两个对象及其所有属性.

从JQuery的示例页面:

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

现在,设置包含合并的设置和选项对象.

Answer 2

JavaScript有一个简单的本机函数来合并对象.这是ES6中引入的Object.assign().

  // creating two JavaScript objects
    var x = { a: true };var y = { b: false}; // merging two objects with JavaScript native function
    var obj = Object.assign(x,y);
    //result
    Console.log(obj); // output is { a: true, b: false }

有关javascript合并对象的更多信息,请检查合并JavaScript对象与示例.

Answer 3

非jQuery解决方案是:

YOUROBJ.vars = {
    vars1: {
        vars1_1: 'an object which will overwrite',
        vars1_2: 'an object which will be added'
    }
};

YOUROBJ.vars2 = (!YOUROBJ.vars) ? {} : YOUROBJ.vars;

YOUROBJ.vars = {
    vars1: {
        vars1_1: 'an object which will be overwritten',
        vars1_3: 'an object which will remain'
    }
};

YOUROBJ.extend = function(obj, defaults) {
    for (var i in defaults) {
        if (!obj[i]) {
            obj[i] = defaults[i];
        } else {
            YOUROBJ.extend(obj[i], defaults[i]);
        }
    }
};
YOUROBJ.extend(YOUROBJ.vars, YOUROBJ.vars2);
delete YOUROBJ.vars2;

如果您希望在加载和创建常规函数对象之前将其添加到常规函数对象,这将非常有用.

这也使第二个YOUROBJ.vars可以作为默认设置.

Answer 4

如果你正在使用jQuery,你应该检查$ .extend函数.

你可以尝试这样的事情:

$.fn.somePlugin = function(options){
  settings = $.extend(true, {default_values: "foo"}, options);
}