當我從數組中刪除一個元素時，為什么同時刪除該數組和行代碼中未提及的另一個數組？

Question

我在從某個數組中刪除一個元素時遇到問題，但它同時從該數組和另一個不相關的數組中刪除了該元素。 有誰發現問題，因為對我來說看起來正確，應該從“ nearby.items”數組中刪除元素“ Beer”，而不要從“ locations_dictionary [0] .items”數組中刪除。

 var nearby = { "looted": false, "items": ["Apple","Rusted Sword","Beer","Bronze Sword","Wooden Sword","Excalibur","Bronze Coin"] }; const locations_dictionary = [ { "name": "City", "items": ["Apple","Rusted Sword","Beer","Bronze Sword","Wooden Sword","Excalibur","Bronze Coin"] }, { "name": "Forest", "items": ["Apple","Stick","Rusted Sword","Corpse","Rusted Dagger"] } ]; function Remove_Item_From_Array(a,v) { //a = array, v = value for(i = 0; i < a.length; i++) { if(a[i] === v) { a.splice(i,1); } } } nearby.items.forEach(function(value,index) { if("Beer" == value) { Remove_Item_From_Array(nearby.items,"Beer"); return; } }) console.log('nearby array ---> ' , nearby, '\\n locations ---> ', locations_dictionary) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 

Answer 1

您的代碼看起來不錯。 我在JSBin上運行了您的確切代碼，並在附近和location_dictionary上登錄：

[object Object] {
  items: ["Apple", "Rusted Sword", "Bronze Sword", "Wooden Sword", "Excalibur", "Bronze Coin"],
  looted: false
}

[[object Object] {
  items: ["Apple", "Rusted Sword", "Beer", "Bronze Sword", "Wooden Sword", "Excalibur", "Bronze Coin"],
  name: "City"
}, [object Object] {
  items: ["Apple", "Stick", "Rusted Sword", "Corpse", "Rusted Dagger"],
  name: "Forest"
}]

看起來附近的項目中沒有啤酒，但是locations_dictionary數組的第一項中有啤酒。 也許問題不在於代碼。

Answer 2

如評論部分所述，您的問題似乎是nearby.items指向內存中與location_dictionary[0].items相同的數組。

這意味着，如果更改內存中nearby.items指向的數組，則location_dictionary[0].items數組也將更改（因為它們共享同一數組），反之亦然。

因此，解決此問題的方法是在內存中為nearby.items創建一個唯一的數組，以便當您更改nearby.items它不會修改相同的數組。

您可以使用傳播語法來做到這一點：

nearby.items = [...location_dictionary[0]]

這將使它nearby.items引用其在內存中的唯一數組，並且與location_dictionary[0].items數組沒有任何關系。

以下是一些示例，可幫助您了解正在發生的事情：

 let a = [1, 2, 3]; // create array [1, 2, 3] and store it in memory, make "a" point to this array let b = a; // make "b" point to the same array in memory that a is pointing to b[0] = 4; // change index 0 of the array in memory console.log(a); // change because a and b share the same array console.log(b); // expected change 

您可以使用傳播語法來創建自己的唯一數組：

 let a = [1, 2, 3]; // create array [1, 2, 3] and store it in memory, make "a" point to this array let b = [...a]; // create a new array which has the same contents as "a" in memory b[0] = 4; // change index 0 of b console.log(a); // didn't change bcause it has its own unqieu reference console.log(b); // expected change 

Answer 3

如果我從注釋中正確理解，您正在嘗試修改nearby.items數組以刪除“啤酒”。 您遇到的問題是locations_dictionary[0].items也已被修改，因為您在某處使用以下代碼分配了nearby.items ：

nearby.items = locations_dictionary[0].items

解決方案是復制數組而不是分配它。

nearby.items = locations_dictionary[0].items.slice(0)
// or if you're using es6
nearby.items = [...locations_dictionary[0].items]

另一個選擇（或什至只是附加）是使用Array#Filter過濾掉“啤酒”字符串。 實際上，這將返回數組的新副本，而無需修改原始副本。 因此，您可以將其分配給nearby.items或僅將其用作單獨的變量。

 let items0 = ["Apple","Rusted Sword","Beer","Bronze Sword","Wooden Sword","Excalibur","Bronze Coin"] var nearby = { "looted": false, "items": items0 }; const locations_dictionary = [ { "name": "City", "items": items0 }, { "name": "Forest", "items": ["Apple","Stick","Rusted Sword","Corpse","Rusted Dagger"] } ]; nearby.items = nearby.items.filter(function(value,index) { return value !== "Beer" }) console.log('nearby array ---> ' , nearby, '\\n locations ---> ', locations_dictionary) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>