如何在不更改对象的情况下更改对象？

Question

所以我的问题是如何在用户对象内部更改petNames对象而不对其进行更改。

const user = { 
        name: 'Harry', 
        age: 50, 
        petNames: { 
         dog: 'Lisie', 
         cat: 'Foxer' 
        } 
    };

我们可以像

一样进行更改

{...user, age: 48 }

它将返回

{ 
 name: 'Harry', 
 age: 48, 
 petNames: { 
    dog: 'Lisie', 
    cat: 'Foxer' 
 } 
};

但是我该如何更改petNames？

例如，狗的名字改为“ Rex”。

并获得

之类的对象

{ 
 name: 'Harry', 
 age: 50, 
 petNames: { 
    dog: 'Rex', 
    cat: 'Foxer' 
 } 
};

谢谢！

Answer 1

您也可以传播内部属性：

const user = {
  name: 'Harry',
  age: 50,
  petNames: {
    dog: 'Lisie',
    cat: 'Foxer'
  }
};

const newUser = {
  ...user,
  petNames: {
    ...user.petNames,
    dog: 'rex'
  }
};

console.log(user.petNames === newUser.petNames); // false