如何使用扩展运算符向对象添加属性，而不是覆盖它？

Posted 2023-02-22

【中文标题】如何使用扩展运算符向对象添加属性，而不是覆盖它？

【英文标题】：How to use spread operator to add property to an object, not override it?

【发布时间】：2019-09-03 02:34:32

【问题描述】：

我有这个功能。

function foo(newdata)  
     utils.method('GET', '/auth', 
        response: 
          data: 
            settings: 
              last_email_notification_shown_date: new Date(),
              email_notifications: null,
            
            ...newdata
          
        
      );
 

但每次我想更新“设置”属性时，我都必须将其全部传递给数据：

foo(settings 
   last_email_notification_shown_date: new Date(),
   email_notifications: null,
   SomeNewProperty: 'whatever'
)

有没有办法更新这个函数中的“设置”属性而不需要整个重写？我只想更新属性，而不是覆盖它。

【问题讨论】：

foo 是否有权访问现有设置？另请注意，您的第二个代码块有一个语法错误，这使得您很难分辨出您真正在做什么。

（旁注：... 不是运算符，它是主要语法；它不能是运算符，因为它没有单一的结果值。实际上并不重要。 :-) 但是如果它是一个运算符，它不会在不同的情况下做不同的事情[传播与休息]，你可以在任何地方使用它。但是您只能在定义了该语法的特定位置使用 spread 和 rest。）

【参考方案1】：

有没有办法更新这个函数中的“设置”属性而不需要整个重写？

很难从您的问题中看出您真正在做什么，但如果目标是将newdata 添加到现有设置中，那么您只是将其散布在错误的位置：

function foo(newdata)  
     utils.method('GET', '/auth', 
        response: 
          data: 
            settings: 
              last_email_notification_shown_date: new Date(),
              email_notifications: null,
              ...newdata // <============================ moved
            
          
        
      );

然后

foo(
   SomeNewProperty: 'whatever'
);

如果您需要使用包含 settings 之外以及 settings 内部的对象调用 foo，那么它会稍微复杂一些，但不会很多：

function foo(newdata)  
     utils.method('GET', '/auth', 
        response: 
          data: 
            ...newdata,                     // <========================
            settings: 
              last_email_notification_shown_date: new Date(),
              email_notifications: null,
              ...newdata.settings           // <========================
            ,
          
        
      );

然后

foo(
    settings: 
       SomeNewProperty: 'whatever'
    ,
    otherStuff: "foo"
);

传播newdata（包括settings），但随后用替换settings覆盖新对象中newdata的settings，我们在其中传播newdata.settings。