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.height并获取我推送的值。

Answer 1

看看JQuery extend方法。它可以合并两个对象及其所有属性。

来自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合并对象的更多信息，请参阅merge JavaScript objects并举例说明。

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

Answer 5

我还在Javascript中创建了一个“合并”功能，用于我的一般用途：

if (typeof Object.merge !== 'function') {
    Object.merge = function (o1, o2) { // Function to merge all of the properties from one object into another
        for(var i in o2) { o1[i] = o2[i]; }
        return o1;
    };
}

用法：

var eDiv = document.createElement("div");
var eHeader = Object.merge(eDiv.cloneNode(false), {className: "header", onclick: function(){ alert("Click!"); }});

它更快更脏（浅拷贝），但它完成了我需要做的事情。

Answer 6

我不太了解你的问题，但我认为你应该使用$ .extend函数：

Settings=$.extend(Settings, Type.video);

以这种方式设置将获得Type.video属性

Answer 7

只需一级合并（将第二个对象的键附加到第一个对象）：

var mergeObjects = function (originalObject, objectToAppend) {
    for (var item in objectToAppend) {
        if (objectToAppend.hasOwnProperty(item)) {
            originalObject[item] = objectToAppend[item];
        }
    }
};

originalObject必须为非空！

将JavaScript对象合二为一

7 个答案: