合并对象的2个对象答案

【问题标题】：Merge 2 objects of objects合并对象的2个对象
【发布时间】：2020-11-28 06:35:06
【问题描述】：

我需要合并 2 个对象。我已经尝试过spread operator 和Object.assign。但我的最终结果仍然只显示第二个对象的结果。

let obj1= {
    ratings: [], 
    stats: {restaurants: 0, bnb: 0, hotel: 0},
    calls: [
        {f_name: 'Harry', l_name: 'Potter', address: 'Godrics Hollow', colors:['red', 'gold']},
        {f_name: 'Ron', l_name: 'Weasley', address: 'The Burrow', colors:['orange', 'black']},
        {f_name: 'Hermione', l_name: 'Granger', address: '123 London', colors:['red', 'blue']},
    ]
}

let obj2= {
    ratings: [], 
    stats: {restaurants: 3, bnb: 2, hotel: 1},
    calls: [
        {f_name: 'Jon', l_name: 'Snow', address: 'The Wall', colors:['white', 'brown']},
        {f_name: 'Robb', l_name: 'Stark', address: 'Winterfell', colors:['red', 'white']},
        {f_name: 'Sansa', l_name: 'Stark', address: 'The North', colors:['white', 'silver']},
        {f_name: 'Arya', l_name: 'Stark', address: 'Essos', colors:['blue', 'silver']},
        {f_name: 'Bran', l_name: 'Stark', address: 'Kings Landing', colors:['purple', 'green']}
    ]
}


let obj3 = {
    ...obj1,
    ...obj2
};

console.log(obj3);
console.log('---------------------------------------------');

let obj4 = Object.assign(obj1, obj2);
console.log(obj3);

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;

两种方式都返回：obj2。

我需要：

{
    ratings: [], 
    stats: {restaurants: 3, bnb: 2, hotel: 1},
    calls: [
        {f_name: 'Harry', l_name: 'Potter', address: 'Godrics Hollow', colors:['red', 'gold']},
        {f_name: 'Ron', l_name: 'Weasley', address: 'The Burrow', colors:['orange', 'black']},
        {f_name: 'Hermione', l_name: 'Granger', address: '123 London', colors:['red', 'blue']},
        {f_name: 'Jon', l_name: 'Snow', address: 'The Wall', colors:['white', 'brown']},
        {f_name: 'Robb', l_name: 'Stark', address: 'Winterfell', colors:['red', 'white']},
        {f_name: 'Sansa', l_name: 'Stark', address: 'The North', colors:['white', 'silver']},
        {f_name: 'Arya', l_name: 'Stark', address: 'Essos', colors:['blue', 'silver']},
        {f_name: 'Bran', l_name: 'Stark', address: 'Kings Landing', colors:['purple', 'green']}
    ]
}

【问题讨论】：

您要求深度合并，这是标准 JS 函数无法实现的。您必须编写自己的深度嵌套例程
见stackoverflow.com/questions/46202433/…
为什么不连接 obj3 的调用数组，例如obj3.calls = [...obj1.calls, ...obj2.calls]? stats 和 ratings 也一样--手动组合？我不确定这是否是您要求的。
Object.assign(obj1, obj2) 用于将属性从 source(obj2) 复制到 target(obj1)。如果属性已经存在于obj1 中，那么它将被obj2 替换。这不像是属性值的深度合并。 .

标签： javascript jquery arrays object ecmascript-6

【解决方案1】：

JS 扩展函数仅有助于浅层合并。在您的情况下，您需要深度合并，因此您需要为其编写自定义逻辑。

如果对象属性始终相同，则可以使用它。

let obj3 = Object.assign({}, obj1);
obj3.ratings.push(...obj2.ratings);
obj3.calls.push(...obj2.calls);

Object.keys(obj2.stats).forEach(function(key,index) {
    obj3.stats[key] += obj2.stats[key];
});
console.log(obj3);

注意：如果您的对象属性发生更改，这将不起作用。

【讨论】：

【解决方案2】：

这是你想要的吗？：

let obj3 = {
    ratings: [
        ...obj1.ratings,
        ...obj2.ratings
    ],
    stats: {
        ...obj1.stats,
        ...obj2.stats
    },
    calls: [
        ...obj1.calls,
        ...obj2.calls
    ]
};

【讨论】：

如果你想总结统计数据，Rajat Sharma 的答案会好得多。我的回答只会用 obj2 的统计数据覆盖 obj1 的统计数据