Как динамически объединить свойства двух объектов JavaScript?

Пример

o1 = { a : 1, b : 2, c : { ca : 1, cb : 2, cc : { cca : 100, ccb : 200 } } }; o2 = { a : 10, c : { ca : 10, cb : 20, cc : { cca : 101, ccb : 202 } } }; o3 = MergeRecursive(o1, o2); 

Создает объект o3 like

 o3 = { a : 10, b : 2, c : { ca : 10, cb : 20, cc : { cca : 101, ccb : 202 } } }; 

Код

 /* * Recursively merge properties of two objects */ function MergeRecursive(obj1, obj2) { for (var p in obj2) { try { // Property in destination object set; update its value. if ( obj2[p].constructor==Object ) { obj1[p] = MergeRecursive(obj1[p], obj2[p]); } else { obj1[p] = obj2[p]; } } catch(e) { // Property in destination object not set; create it and set its value. obj1[p] = obj2[p]; } } return obj1; } 
 function mergeRecursive() { // _mergeRecursive does the actual job with two arguments. var _mergeRecursive = function (dst, src) { if (isDOMNode(src) || typeof src !== 'object' || src === null) { return dst; } for (var p in src) { if (!src.hasOwnProperty(p)) continue; if (src[p] === undefined) continue; if ( typeof src[p] !== 'object' || src[p] === null) { dst[p] = src[p]; } else if (typeof dst[p]!=='object' || dst[p] === null) { dst[p] = _mergeRecursive(src[p].constructor===Array ? [] : {}, src[p]); } else { _mergeRecursive(dst[p], src[p]); } } return dst; } // Loop through arguments and merge them into the first argument. var out = arguments[0]; if (typeof out !== 'object' || out === null) return out; for (var i = 1, il = arguments.length; i {amp}lt; il; i  ) { _mergeRecursive(out, arguments[i]); } return out; } 

Несколько примеров

Установить innerHTML и стиль элемента HTML

 mergeRecursive( document.getElementById('mydiv'), {style: {border: '5px solid green', color: 'red'}}, {innerHTML: 'Hello world!'}); 

Слияние массивов и объектов. Обратите внимание, что undefined может использоваться для сохранения значений в левом массиве / объекте.

 o = mergeRecursive({a:'a'}, [1,2,3], [undefined, null, [30,31]], {a:undefined, b:'b'}); // o = {0:1, 1:null, 2:[30,31], a:'a', b:'b'} 

Любой аргумент, не являющийся объектом JavaScript (включая ноль), будет игнорироваться. За исключением первого аргумента, также DOM-узлы отбрасываются. Помните, что строки, созданные как new String (), на самом деле являются объектами.

 o = mergeRecursive({a:'a'}, 1, true, null, undefined, [1,2,3], 'bc', new String('de')); // o = {0:'d', 1:'e', 2:3, a:'a'} 

Если вы хотите объединить два объекта в новый (не затрагивая ни один из двух), поставьте {} в качестве первого аргумента

 var a={}, b={b:'abc'}, c={c:'cde'}, o; o = mergeRecursive(a, b, c); // o===a is true, o===b is false, o===c is false 

Изменить (от ReaperSoon):

Также объединить массивы

 function mergeRecursive(obj1, obj2) { if (Array.isArray(obj2)) { return obj1.concat(obj2); } for (var p in obj2) { try { // Property in destination object set; update its value. if ( obj2[p].constructor==Object ) { obj1[p] = mergeRecursive(obj1[p], obj2[p]); } else if (Array.isArray(obj2[p])) { obj1[p] = obj1[p].concat(obj2[p]); } else { obj1[p] = obj2[p]; } } catch(e) { // Property in destination object not set; create it and set its value. obj1[p] = obj2[p]; } } return obj1; } 

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector