克隆数组（不是引用的副本）并修改新数组

Question

我认为我的问题很容易解决，但作为一个新手，我无法解决这个问题。

\n

const arr1 = [\n  { department: "Lebensmittel", id: "id6", product: "Nudeln", status: false },\n  { department: "Ceralien", id: "id5", product: "Marmelade", status: false },\n  { department: "Ceralien", id: "id3", product: "M\xc3\xbcsli", status: false },\n  { department: "Ceralien", id: "id4", product: "Honig", status: false },\n  { department: "Molkereiprodukte", id: "id1", product: "Milch", status: false }\n];\n\nlet testArr = [...arr1];\n\ntestArr.forEach(obj => (obj.status = "test"));\n\nconsole.log(arr1, testArr)\n

\n

日志显示，forEach() 函数也应用于 arr1。为什么会这样以及如何保持 arr1 不可变？

\n

arr1 = [\n  { department: "Lebensmittel", id: "id6", product: "Nudeln", status: false },\n  { department: "Ceralien", id: "id5", product: "Marmelade", status: false },\n  { department: "Ceralien", id: "id3", product: "M\xc3\xbcsli", status: false },\n  { department: "Ceralien", id: "id4", product: "Honig", status: false },\n  { department: "Molkereiprodukte", id: "id1", product: "Milch", status: false }\n];\n\n testArr = [\n  { department: "Lebensmittel", id: "id6", product: "Nudeln", status: false },\n  { department: "Ceralien", id: "id5", product: "Marmelade", status: false },\n  { department: "Ceralien", id: "id3", product: "M\xc3\xbcsli", status: false },\n  { department: "Ceralien", id: "id4", product: "Honig", status: false },\n  { department: "Molkereiprodukte", id: "id1", product: "Milch", status: false }\n];\n

\n

Answer 1

arr1包含对象，因此仅克隆arr1是不够的。您需要克隆太中的对象arr1。

\n

您可以使用.map()函数和扩展运算符创建一个新数组，其中包含 中对象的克隆arr1。

\n

\r\n

\r\n

const arr1 = [\n  { department: "Lebensmittel", id: "id6", product: "Nudeln", status: false },\n  { department: "Ceralien", id: "id5", product: "Marmelade", status: false },\n  { department: "Ceralien", id: "id3", product: "M\xc3\xbcsli", status: false },\n  { department: "Ceralien", id: "id4", product: "Honig", status: false },\n  { department: "Molkereiprodukte", id: "id1", product: "Milch", status: false }\n];\n\nlet testArr = arr1.map(obj => ({...obj}));\n\ntestArr.forEach(obj => (obj.status = "test"));\n\nconsole.log(arr1[0]);\nconsole.log(testArr[0]);

\r\n

.as-console-wrapper { max-height: 100% !important; top: 0; } 

\r\n

\r\n

\r\n

\n

使用.map()函数还可以更新返回的对象。因此，您可以删除forEach循环，只使用.map()函数来克隆对象，还可以更新status克隆对象的属性。

\n

\r\n

\r\n

const arr1 = [\n  { department: "Lebensmittel", id: "id6", product: "Nudeln", status: false },\n  { department: "Ceralien", id: "id5", product: "Marmelade", status: false },\n  { department: "Ceralien", id: "id3", product: "M\xc3\xbcsli", status: false },\n  { department: "Ceralien", id: "id4", product: "Honig", status: false },\n  { department: "Molkereiprodukte", id: "id1", product: "Milch", status: false }\n];\n\nlet testArr = arr1.map(obj => ({...obj, status: \'test\'}));\n\nconsole.log(arr1[0]);\nconsole.log(testArr[0]);

\r\n

.as-console-wrapper { max-height: 100% !important; top: 0; }

\r\n

\r\n

\r\n

\n