更改对象键的值会同时更改另一个

Question

我有一个复杂的变量作为一个对象，包括相同对象的2倍。 如果更改第一对象部分的值，则将假定更改第二部分的值。有解释吗？为何仍然连接拖车键？！ 这是我的代码的一个简单示例：

arr1={'a':[],'b':{'b1':'','b2':''}};
arr2={'p1':{...arr1},'p2':{...arr1}};

arr2['p1']['a']=[1,2,3];
console.log(arr2['p2']['a']);   // works => []

arr2['p1']['b']['b1']='blabla';
console.log(arr2['p2']['b']['b1']);   // doesn't work => 'blabla'

我不想写'B = {'b1'：{'a'：''}，'b2'：{'a'：''}}''，因为A在a中是一个很大的对象分隔的.js文件

Answer 1

-使用spread operator可以使您免于此类问题

• 散布运算符的基本思想是使用现有对象的自身属性创建一个新的普通对象。因此{... obj}创建一个具有与obj相同的属性和值的新对象

• 您可以轻松地做到

      A={'a':''};
      B={'b1':{...A},'b2':{...A}};
      B['b1']['a']='blabla';
      console.log(B['b2']);   // => '' not 'blabla'
  

Answer 2

A={'a':''};
B={'b1':A,'b2':A};
B['b1']['a']='blabla';

主要原因是您尝试通过其索引a更改对象元素，而不是更改对象（引用）。

• 您要求找到B['bi']对象A
• 然后您要求将A['a']设置为blabla
• B['b1']和B['b2']指向A
• 您更改了“两者”，因为它是A的相同实例

但是，如果您执行B['b1'] = { 'a': 'blabla' }，则不会得到相同的结果。因为现在您要添加一个与A没有任何连接的新实例。

Answer 3

我用以下方法解决了这个问题：

arr2={'p1':JSON.parse(JSON.stringify(arr1)),'p2':JSON.parse(JSON.stringify(arr1))};