Комбинирование объектов JavaScript в один

Question

У меня есть функция под названием «Colorbox» (JQuery плагин), который принимает ряд параметров, например так:

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

У меня есть несколько различных типов «это», хотя, каждый из которых их собственными свойствами. Как так:

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

Помимо этого, у меня есть другие модели поведения, логику и группу «по умолчанию» параметров (которые переписываются более специфические). То, что я пытаюсь сделать, это нажать все соответствующие параметры, из нескольких объектов, в единый объект, так что я могу просто позвонить:

$(this).colorbox(Settings); 

Как бы я перевести неизвестную группу свойств и их значений (например, «ширина» и «высота») от чего-то типа 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

Я не понимаю ваш вопрос очень хорошо, но я думаю, вы должны использовать функцию $ .extend:

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

таким образом настройки получите Type.video свойства

Answer 3

Если вы используя jQuery, вы должны проверить функцию $.extend.

Вы могли бы попробовать что-то вроде этого:

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

Answer 4

Не-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 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

Просто первое сращивание уровня (добавление ключей от второго объекта к первому):

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

originalObject должен быть ненулевым!

Answer 7

У JavaScript есть простая нативная функция для слияния объекта. который является Object.assign(), введенным в ES6.

// 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 } 

для получения дополнительной информации о яваскрипте слияния объекта, пожалуйста, проверьте на merge JavaScript objects с примерами.

Answer 8

Этот компонент object-merge можно использовать повторно, который полагается на Object.assign и объединяет несколько объектов в один, не изменяя исходные объекты.

Примеры:

const o1 = { a: 1 }; 
const o2 = { b: 2 }; 
const o3 = { c: 3 }; 

const obj = merge(o1, o2, o3); 
console.log(obj); // { a: 1, b: 2, c: 3 } 
console.log(o1); // { a: 1 } does not mutate objects