为什么数组的深度拷贝不能使用 JavaScript 工作？

Question

我正在尝试深度复制一个对象数组，但它不起作用。我使用的是React，但这里的问题是纯JavaScript。

const [selected, setSelected] = useState(value);

值是来自父组件的值。

const onClickFunction = (arr) => {
const newClonedArray = selected.map((a) => ({
...a
}));
// try to clone selected array 
// i am also try with 
// let clonedArray = JSON.parse(JSON.stringify(selected))
// also no work
const result = intersectionBy(arr, newClonedArray, "id");
// here return only common items from two array using lodash library
setSelected(result);
console.log('selected  item right now should be changed', selected)
// NO RESULT IS NOT CHANGED
result.forEach((i) => {
handleItemClick(i); // no important for now
});
}

在函数中，我详细解释了问题所在。

为什么阵列不进行深度复制？

所选状态类似于数组->

[
{ id : 1 , name: 'test' },
{ id : 2 , name: 'test 2' }
]

在深度复制之后，我需要将所选数组更改为类似->

[
{ id : 1 , name: 'test' , title : 'title 1 ' },
{ id : 2 , name: 'test 2' , title : 'title 2 '  }
]

我只想从某个字符串中复制一些值。

Answer 1

您需要将Object.assign或JSON.stringify与JSON.parse一起使用

var selected = [
{ id : 1 , name: 'test' },
{ id : 2 , name: 'test 2' }
]
var newArray = JSON.parse(JSON.stringify(selected));
//do whatever you want to on newArray
newArray.map(a => a.title = a.name);
console.log("selected",selected)
console.log("newArray", newArray)