更改对象的属性也会影响另一个对象

Question

问题：当我更改多边形points的{​​{1}}时，它还会更改另一个多边形poly2的{​​{1}} !! < / p>

为什么更改另一个也会改变另一个，我们如何解除它们？

points

jsfiddle： http://jsfiddle.net/8hFyv/

Answer 1

poly2.setPoints(poly.getPoints());

这是你的问题。 points数组是完全相同的对象。

由于数组中有数组，slice(0)技巧不起作用，您需要深层复制。

幸运的是，你正在使用jQuery，它有一个方法可以做到。

将以上行替换为：

poly2.setPoints($.extend(true, [], poly.getPoints()));

Answer 2

执行此操作时，poly和poly2对象引用相同的点数组：

poly2.setPoints(poly.getPoints());

将其更改为：

poly2.setPoints([0, 0, 100, 0, 100, 100, 0, 100]);

Answer 3

要克隆点，而不是在多边形之间共享点，您需要为每个人创建新对象。

您可以使用map执行此操作：

poly2.setPoints(poly.getPoints().map(function (p) {
    return { x: p.x, y: p.y };
}));

或者jQuery.map：

poly2.setPoints($.map(poly.getPoints(), function (p) {
    return { x: p.x, y: p.y };
}));

Answer 4

其他答案在评估问题时是正确的，但还有另一种方法可以解决它：在设置时“克隆”点数组。换句话说：

poly2.setPoints(poly.getPoints().slice());

如果由于某种原因，getPoints()返回的不是数组，你需要一种不同的克隆方法（例如axel.michel建议的方法），但是因为我认为它确实对你有效

Answer 5

问题是，poly.getPoints是一组动能指针对象，要摆脱它，请尝试以下方法：

poly2.setPoints(JSON.parse(JSON.stringify(poly.getPoints())));