当我执行“x=y”并更改“x”后，它也会更改“y”。我该如何防止这种情况？

Question

例如我有listings数组：

[ { name: 'bob', price: '10' }, { name: 'jack', price: '12' } ]

我正在尝试找到最低卖家并稍后使用它的数据。我愿意var currentLowestSeller = listings[0];

现在currentLowestSeller是：

{ name: 'bob', price: '10' }

后来我做了更改，currentLowestSeller但我不想listings更改主数组。我currentLowestSeller.price = currentLowestSeller.price * 0.5;这样做了，这个列表数组看起来像这样：

[ { name: 'bob', price: 5 }, { name: 'jack', price: '12' } ]

我该如何防止这种情况？

如果你想重新创建它，只需运行以下代码：

var listings = [];

var name1 = 'bob';

var name2 = 'jack';

var price1 = '10';

var price2 = '12';

listings.push({

  name: name1,

  price: price1

})

listings.push({

  name: name2,

  price: price2

})

var currentLowestSeller = listings[0];

currentLowestSeller.price = currentLowestSeller.price * 0.5;

console.log(listings);

我尝试过的：

我尝试在执行任何操作之前创建数组的副本listings。

var unchangedListings = listings;

var currentLowestSeller = listings[0];

currentLowestSeller.price = currentLowestSeller.price * 0.5;

console.log(unchangedListings);

但这没有用。

后来我决定这const unchangedListings = listings;会有所帮助。但由于某种原因，它也会更改定义为常量的值。

Answer 1

var unchangedListings = listings;这意味着，unchangedListings正在指示 的值listings，因此如果您更改该unchangedListings值，则意味着您也在更新listings。为了防止这种情况，您需要克隆该值。您应该深度克隆该对象。var currentLowestSeller = JSON.parse(JSON.stringify(listings[0]))或者var currentLowestSeller = Object.assign({}, listings[0])

Answer 2

问题的根源您看到的行为对于大多数语言来说都是常见的，与 javascript 无关。数组仅包含对其所包含对象的引用。从数组（或与此相关的对象）中提取键不会复制该键的值。如果是这种情况，就无法对程序的状态进行任何更改。var a = { toto: 1 };  // create objectvar b = a;            // b is pointing the the same objectb['toto'] = 2;        // update the object (there is only one)console.log(a == b);  // true because a and b are the SAME object (not just equal,                      // both a and b point to the same place in the computer memory)console.log(a);       // { toto: 2 } both objects have been edited如果需要操作一个对象而不修改原始对象，则需要显式地创建一个副本。但是，当使用嵌套对象或嵌套数组时会出现问题。您需要“深拷贝”还是“浅拷贝”？浅拷贝浅复制意味着仅复制“第一层”。var a = { toto: 1, tata: { tutu: 1 } };var b = { ... a }; // make a "shallow copy"// We change "b", did "a" change? => Nob.toto = 2;console.log(a); // { toto: 1, tata: { tutu: 1 } }                // "a" was not modified!console.log(b); // { toto: 2, tata: { tutu: 1 } }                // "b" was modified!// we change a nested object in "b", did "a" change? => Yesb.tata.tutu = 2;console.log(a); // { toto: 1, tata: { tutu: 2 } }                // "a" was modified!console.log(b); // { toto: 2, tata: { tutu: 2 } }                // "b" was modified!深拷贝深层复制将复制所有嵌套数组和对象（并且会带来显着的性能成本）。Javascript 没有内置执行深拷贝的语言，因为它不是常见的操作，而且成本高昂。执行对象深层复制的最常见方法是使用 JSON 内置函数，但许多方法存在不同的优缺点（例如，使用 JSON 内置函数速度很快，但如果对象包含 或 实例，则会中断NaN）Date。var a = { toto: 1, tata: { tutu: 1 } };var b = JSON.parse(JSON.stringify(a)); // make a "deep copy"// a and b are now completely different, they share nothing in memory// we can edit any subobject, they will not be any consequence between them.a.tata.tutu = 2;

Answer 3

如果列表或字典是嵌套的，您可以使用Ramda 库clone中的内容：import { clone } from 'ramda';var currentLowestSeller = clone(listings[0]);

Answer 4

Javascript（以及许多其他语言）最重要的概念之一是引用类型的概念。Javascript 有 3 种通过引用传递的数据类型：Array、Function和Object。在你的情况下：var unchangedListings = listings; // still points to listings var currentLowestSeller = listings[0]; // changes listings在改变数组之前复制数组始终是一个好习惯：const currentLowestSeller = [... listings]; // currentLowestSeller points to a new array