łączenie obiektów JavaScript w jedną

Question

Mam funkcji o nazwie „Colorbox” (jQuery plugin), które ma szereg parametrów tak:

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

Mam kilka różnych typów „to”, choć każdy z ich własne właściwości. Tak:

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

Poza tym mam inne zachowania, logiki i „default” grupę ustawień (które zostaną zastąpione przez bardziej konkretnych z nich). Co próbuję zrobić, to nacisnąć wszystkie odpowiednie ustawienia, z wielu obiektów w jeden obiekt, więc mogę po prostu zadzwonić:

$(this).colorbox(Settings); 

Jak mogę przenieść nieznaną grupę właściwości i ich wartości (na przykład "width" i "height") z czegoś takiego jak Type.video do Ustawień? Celem jest wywołanie funkcji Settings.height i odzyskanie wartości, którą wprowadziłem.

Answer 1

Spójrz na metodę JQuery extend. Może łączyć ze sobą dwa obiekty i wszystkie ich właściwości.

z przykładu stronie jQuery:

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

teraz Ustawienia zawiera scalone ustawienia i opcje obiektów.

Answer 2

Nie rozumiem Twoje pytanie bardzo dobrze, ale myślę, że należy użyć $ .extend funkcję:

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

w ten sposób ustawienia dostanie Type.video właściwości

Answer 3

Jeśli jesteś za pomocą jQuery powinieneś sprawdzić funkcję $.extend.

Można spróbować czegoś takiego:

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

Answer 4

Non-jQuery rozwiązanie jest:

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; 

Funkcja ta jest przydatna, jeśli chcesz dodać zmienną do ogólnych funkcji obiektu przed jej został załadowany i utworzony.

Umożliwia to również działanie drugiego ustawienia YOUROBJ.vars jako ustawienia domyślnego.

Answer 5

Mam też stworzyliśmy funkcję "scalić" w javascript, aby korzystać z moich ogólnych celów:

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

Zastosowanie:

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

To szybsza i brudniejsze (płytkie kopia), ale robi czego potrzebuję.

Answer 6

prostu pierwszy poziom łączących (dodanie kluczy drugiego przedmiotu do pierwszej)

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

originalObject musi niezerowe!

Answer 7

JavaScript ma prostą natywną funkcję do scalania obiektu. która jest Object.assign() wprowadzona w 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 } 

Więcej informacji na temat łączenia javascript obiektu należy sprawdzić w merge JavaScript objects z przykładów.

Answer 8

Można również użyć tego wielorazowego komponentu, który jest oparty na Object.assign i łączy wiele obiektów w jeden bez mutowania oryginalnych obiektów.

Przykłady:

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