Javascript - 在 while 循环中修改两个数组，两个数组都保留第二个值

Question

我有一个数组数据，其中包含一个nodeData对象，其中包含一个id

我制作了数组的 2 个副本:

    const dropAboveData = data.slice();
    const dropBelowData = data.slice();

然后我尝试以不同的方式修改我的两个复制数组的两个副本

    for(let i = 0; i<data.length; i++){
        dropAboveData[i].nodeData.id = -1;
        dropBelowData[i].nodeData.id = -2;
    }

例如，如果 data 中的每个记录都有 data[i].nodeData.id = 0，那么最后我希望 dropAboveData 包含所有 id 为 -1 的内容，而 dropBelowData 包含所有 id 为 -2 的内容。

但是看起来 data、dropAboveData 和 dropBelowData 都变成了用 -2 填充的数组。

为什么会发生这种情况？我虽然 slice() 制作了数组的副本，这样我就不会访问同一个对象？

Answer 1

Slice进行浅复制

The slice() method returns a shallow copy of a portion of an array into a new array object selected from begin to end (end not included). The original array will not be modified.

您可以像这样复制对象数组:

var data = [{
  'a': '0'
}, {
  'b': '1'
}, {
  'c': '2'
}]
dropAboveData = []
dropBelowData = []

data.map(o => {
  dropAboveData.push(JSON.parse(JSON.stringify(o)));
  dropBelowData.push(JSON.parse(JSON.stringify(o)));
});

dropAboveData[0] = 1; //<-- modify only dropAboveData
dropAboveData[1].b = 99;//<-- modify only dropAboveData

console.log(dropAboveData)
console.log(dropBelowData)