javascript - 对象赋值正在改变值

Question

我有一个用于重置值的对象，如下所示:

export const cleanTeam = {
   id: "",
   name: "",
   players: []
}

然后我使用 cleanTeam 创建一个新对象看起来像这样:

let team1 = cleanTeam;

然后我将在 team1 中设置属性值如:

team1.id = 123;
team1.name = "My New Team";

后来，我创建了team2使用cleanTeam这样我就有了一个具有相同结构但没有值的新对象。但是，我注意到我分配的值在cleanTeam中以及。换句话说，我的cleanTeam现在看起来像这样:

{
   id: 123,
   name: "My New Team",
   players: []
}

不应该cleanTeam当我在 team1 中设置值时保持完整？

我知道为什么会发生这种情况。我认为两者都是cleanTeam和team1都指向内存中的同一个对象。我如何保留cleanTeam对象干净？

Answer 1

对象是引用类型。当您将一个对象分配给另一个对象时，它仅复制引用。所以你实际上有两个引用同一个对象的引用。

考虑一个有两扇门的房间。当您从第一扇门进来并在房间中进行更改，然后从第二扇门进来时，您会看到更改。

要复制第一级值，您可以使用 Object#assign功能。这会复制属性。但请注意，如果对象内部有一个对象，这将仅在您的情况 players 中复制引用，这是一个引用类型。

const cleanTeam = {
   id: "",
   name: "",
   players: []
};

const newObj = Object.assign({}, cleanTeam);

newObj.id = 1;

console.log(cleanTeam, newObj);

为什么不使用 JSON.parse(JSON.stringify()) 解决方案？

它不会复制函数，因为 JSON 仅存储状态，而不是功能。

const a = {
  id: 1,
  func: function(){
    console.log('Hello');
  }
};

a.func();

const b = JSON.parse(JSON.stringify(a));

b.func(); // Error