什么时候需要使用Object.assign()方法来复制对象的实例？

Question

以下是我自己练习此问题的示例场景.如果您想直接跳到技术细节,请参阅下面的"技术细节".

我有一个个人项目,我一直在努力学习JavaScript.基本上,用户可以通过挑选可用选项来设计鞋子.

诀窍在于左右鞋必须具有相同的尺寸,以及其他属性,但是诸如颜色,鞋带纹理等的东西可以是每个鞋子的独立属性.(我认为这对我来说是一种体面的方式来练习对象操作和继承).

用户开始设计合适的鞋子; 当点击"交换"按钮以查看左鞋时,用户当前看到右鞋的副本(但是倒置). 只有在第一次换鞋时才生成左鞋,并制作了正确鞋子的精确副本.从那时起,每个鞋子方向的独特选项得以保留.然后,如果用户对该左鞋模型进行了特定的更改,然后切换到右鞋,则用户应该在他们点击"交换"按钮之前看到他们最初设计的完全相同的右鞋.

因此,如果他们的右鞋有红色鞋带,他们会切换到左侧鞋子视图并使左侧鞋子有蓝色花边,然后当切换回右侧鞋子时,用户应该看到红色鞋带!

---

技术细节

当我为我的主项目编写代码时,遇到了独特的选项,我遇到了麻烦.例如,如果我为左鞋制作鞋带绿色,那么右鞋总是会有绿色鞋带.对问题进行故障排除很容易,因为正确的鞋子失去它的唯一选择,例如红色蕾丝,就是我为左鞋设置蕾丝颜色的时候.

console.log("THE RIGHT LACE BEFORE: " + rightShoe.laceId);
leftShoe.laceId = 'green';
console.log("THE RIGHT LACE AFTER: " + rightShoe.laceId);

记录到控制台的是:

之前的正确的蕾丝:红色

正确的蕾丝后:绿色

即使我没有改变rightShoe它,每当我改变leftShoe房产时它都会被改变.

所以我回到了我第一次定义leftShoe对象的位置,这是用户在脚本生命周期中第一次点击"交换"的时候(我的业余想法是为什么leftShoe如果用户可能永远不会自定义左边的话来传播并填充对象鞋子？也许它对数据不必要地吝啬,我不知道.从那时起,我从未重新定义leftShoe为副本,rightShoe反之亦然.我认为我可能因为我可能正在进行对象引用而被挂起,就像其他语言一样,我正在改变引用而不是值.

在遇到麻烦之前,我想制作一个JSFiddle来重现问题.由于我的项目很长(约1500行,包括一些THREE.js用于图形),我尽力模仿这个过程.所以就是这样.

除了JSFiddle完全按照我的预期工作!左侧模型保留了它对该属性的唯一属性和数据集.所以,我做了一些关于Object.assign()方法的挖掘和阅读.所以在我原来的项目代码(不是小提琴)中,我改变了这个:

leftShoe = rightShoe;

对此:

leftShoe = Object.assign({}, rightShoe);

我很高兴终于让它工作了,我同样感到好笑和困惑,因为我不明白为什么我的JSFiddle不需要这个assign()方法,但是我的相同的项目代码确实如此.谢谢.

Answer 1

Object.Assign生成左侧鞋子的新COPY,包括所有可枚举的OWN属性.当你使用leftshoe = rightshoe时,你正在对左鞋进行参考.引用指向同一个对象,而不是新复制.因此,如您所述,更改引用的属性实际上正在更改原始属性.