嵌套对象分配Javascript

Question

我有两个这样的对象：

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

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

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

我如何获得此输出：

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

简而言之，我想在每个子对象上进行对象分配=>（如果属性存在，请首先检查儿童，如果它是对象，请不要超过）

Answer 1

您可以为对象的每个级别使用深度合并功能。

函数deepMerge作为给定目标的单个函数或作为Array#reduce的回调，其中迭代一个对象数组，并提供一个空对象作为startvalue进行缩减。

函数/回调itselft有两个参数，一个用于目标对象，另一个用于源对象，其中所有条目都被采用和迭代。

检查对象的值，如果类型是对象，则使用新的目标属性（如果未给出）或exitent属性对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)the prop属性的b覆盖而不合并prop时。 Reference

请尝试以下方法：

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

Answer 3

如果Object.assign没有硬性要求，你可以在es6中这样做：

 var c = {prop:{...a.prop, ...b.prop}}

请参阅Spread syntax上的MDN