javascript - 从另一个对象创建新对象而不持久更改

Question

我使用数组作为一些基本样板对象的容器，这些对象可以被复制并添加到另一个数组，然后进行修改。问题是当我分配对象的新数组所有权时，任何更改都会保留到原始对象(不应更改)。

一个例子:

var originals = [{ name: "One", value: 1 }, { name: "Two", value: 2 }, { name: "Three", value: 3 }];

var notOriginal = [];

notOriginal.push(originals[0]);

// THIS GIVES ME - notOriginal = [{ name: "One", value: 1 }];

notOriginal[0].name = "Uno";

// THIS RESULTS IN - originals = [{ name: "Uno", value: 1 },...];

我试图让“原始”变量保持不变——它不应该改变。

我在谷歌上搜索了很多并尝试了一些东西，但不确定在哪里可以找到解决方案。

具体来说，这是在 VueJS 中发生的，而对象在我的 data() 中

Answer 1

使用 JSON.parse 和 JSON.stringify 对其进行深度复制

var originals = [{
  name: "One",
  value: 1
}, {
  name: "Two",
  value: 2
}, {
  name: "Three",
  value: 3
}];

var notOriginal = [];

notOriginal.push(JSON.parse(JSON.stringify(originals[0])));



notOriginal[0].name = "Uno";
console.log(originals)