嵌套对象分配 Javascript

Question

我有两个这样的对象：

var a = {prop:{a:'1'}}
var b = {prop:{b:'1'}}

我想使用 Object.asassign 合并这两个对象。我试过这个：

var c = Object.assign(a,b)
> {prop:{b:'1'}}

如何获得此输出：

{prop:{a:'1',b:'1'}}

简而言之，我想在每个子对象上做对象分配 =>(如果属性存在，如果它是对象，请先检查子项，不要覆盖(

Answer 1

您可以对对象的每个级别使用深度合并函数。

该函数deepMerge作为给定目标的单个函数或作为Array#reduce的回调，其中迭代对象数组并提供一个空对象作为startvalue用于化约。

函数/回调本身有两个参数，一个用于目标对象，另一个用于获取和迭代所有条目的源对象。

检查对象的值，如果类型是对象，则使用新的目标属性(如果未给定(或退出属性完成deepMerge的递归调用。

如果该值不是对象，则该值将分配给具有给定键的target。

结果是一个新对象，其中包含给定对象的所有属性。

function deepMerge(target, source) {
Object.entries(source).forEach(([key, value]) => {
if (value && typeof value === 'object') {
deepMerge(target[key] = target[key] || {}, value);
return;
}
target[key] = value;
});
return target;
}
var a = { prop: { a: '1' } },
b = { prop: { b: '1' } },
c = [a, b].reduce(deepMerge, {});

console.log(c);

Answer 2

由于 a 和 b 在您的情况下包含具有相同名称的属性，因此当您执行类似Object.assign(a,b)的操作时，b 的prop属性会覆盖并且不合并 prop。参考

请尝试以下操作：

var a = {prop:{a:'1'}}
var b = {prop:{b:'1'}}
var c = {};
c.prop = Object.assign({},a.prop,b.prop);
console.log(c);

或

您可以编写自己的自定义函数，该函数可以合并具有相同属性的对象的值。

请尝试以下操作：

function merge(source, target) {
Object.keys(source).forEach((k) => {
if (source[k].constructor.toString().indexOf('Object') > -1 && target[k]) {          
merge(source[k], target[k]);
return;
}
target[k] = source[k];
});
return target;
}
var a = {prop:{a: '1'}};
var b = {prop:{ b: '1'}};
var c = {};
[a,b].forEach((e)=>merge(e, c));

console.log(c);