Object.assign()合并对象

Posted 2023-05-04

参考技术A Object.assign()是es6中新增的合并对象的方法，该方法接受一个目标对象和一个或者多个源对象作为参数，然后将每个源对象中可枚举( Objetc.propertyIsEnumerable() 返回true)和自有( Object.hasOwnproperty() 返回true)属性复制到目标对象。
案例1:简单复制

案例2：多个源对象

案例3.获取函数与设置函数

Object.assign() 实际上对每个源对象执行的是浅复制，如果多个源对象都有相同的属性，则使用最后一个复制的值，但是要注意：不能在两个对象之间转移获取函数和设置函数。
案例4： Object.assign会覆盖重复的属性

案例5:对象引用
浅复制意味着只会复制对象的引用

案例6:错误处理

原文参考:
javascript高级程序设计 第四版 ，在这里写这些笔记只是为了方便自己回过头来复习

合并对象与 Object.assign 覆盖内部对象而不合并 [重复]

【中文标题】合并对象与 Object.assign 覆盖内部对象而不合并 [重复]

【英文标题】：Merge object with Object.assign override internal object without merge [duplicate]

【发布时间】：2017-09-22 17:01:39

【问题描述】：

我有两个对象要合并到一个新对象中，第一个对象是谷歌图表的默认选项：

optionsA = 
    height: 500,
    focusTarget: 'category',
    hAxis: 
      showTextEvery: 0,
      slantedText: true,
      slantedTextAngle: 45,
      format: 'date',
    ,

对于我的第二个对象，我想向hAxis 添加一些属性并用新值覆盖当前选项，但我想在 optionsA 中默认保留这些选项。

这是我的第二个对象：

optionsA = 
    isStacked: true,
    hAxis: 
      gridlines: 
        count: 10
      ,
      format: 'percent',
    ,

这些对象更复杂，但我减少了属性以简化问题

当我尝试与 object.assign 合并时，结果是对象 B 向新对象添加了新的根属性，但 hAxis 中的属性完全被 optionsB 中的选项覆盖。

let newObj = Object.assign(, optionsA, optionsB);

这是我想要的对象：

    height: 500,
    focusTarget: 'category',    
    isStacked: true,
    hAxis: 
      gridlines: 
         count: 10
      ,
      format: 'percent',
      showTextEvery: 0,
      slantedText: true,
      slantedTextAngle: 45,
    ,

但我得到的不是这个：

    height: 500,
    focusTarget: 'category',    
    isStacked: true,
    hAxis: 
       gridlines: 
         count: 10
       ,
       format: 'percent',
    ,

hAxis 中的属性完全被新属性覆盖，我的方法有什么问题？

【问题讨论】：

Object.assign() 仅对源对象的***属性进行操作。它不会“下降”到子对象中。

参考这个-***.com/questions/27936772/…

Object.assign(, optionsA, optionsB, hAxis: Object.assign(, optionsA.hAxis, optionsB.hAxis)) 应该这样做

【参考方案1】：

如果嵌套不深，您可以分两步打破合并过程，如下所示：

optionsA = 
    height: 500,
    focusTarget: 'category',
    hAxis: 
      showTextEvery: 0,
      slantedText: true,
      slantedTextAngle: 45,
      format: 'date',
    
;

optionsB = 
    isStacked: true,
    hAxis: 
      gridlines: 
        count: 10
      ,
      format: 'percent',
    
;

let newNestedMerged = Object.assign(,optionsA.hAxis, optionsB.hAxis);
optionsA.hAxis = newNestedMerged;
optionsB.hAxis = newNestedMerged;
let newObj =  Object.assign(optionsA, optionsB);
console.log(newObj);

这有帮助吗？

【参考方案2】：

因为您在两个对象中具有相同的属性。

属性被具有相同属性的其他对象覆盖 参数顺序后面的属性。

让我们看看MDN中assign的例子。

我的建议是先合并相同的属性。

optionsA = 
    height: 500,
    focusTarget: 'category',
    hAxis: 
      showTextEvery: 0,
      slantedText: true,
      slantedTextAngle: 45,
      format: 'date',
    ,

optionsB = 
    isStacked: true,
    hAxis: 
      gridlines: 
        count: 10
      ,
      format: 'percent',
    ,

Object.assign(optionsA.hAxis, optionsB.hAxis);
let newObj = Object.assign(, optionsB, optionsA);
console.log(newObj);

【讨论】：

好方法但对我不起作用，这是一个简单的对象示例，实际上我需要合并很多属性。

是的，我想这就是您要找的东西。希望有帮助:) ***.com/a/383245/4886453

感谢@tai-le 你救了我的一天！

酷 :) 很高兴知道。如果对你有帮助。让我们接受它:)

对不起@tai-le，但您评论中的答案实际上对我有帮助。 Object .assign 仅合并根属性，这对我不起作用