如何在 JS 构造函数中复制属性而不更改原始属性

Question

我是 JS 构造函数的新手。我有一个对象/构造函数。该函数将数据作为属性。但是我需要两份数据副本：一份用于更改，一份作为重置参考。然而，改变一个似乎无论如何都会改变另一个：

var myData = [1, 2, 3, 4, 5]
myFunction(myData)

function myFunction(data){
   this.updatableData = data;
   this.resetData = data;

   this.updatableData.pop()

   console.log(this.resetData)

   //expect [1,2,3,4,5]
   //but get [1,2,3,4]


}

Answer 1

使用扩展语法复制原始数组

var myData = [1, 2, 3, 4, 5]
myFunction(myData)

function myFunction(data){
   this.updatableData = data;
   this.resetData = [...data];

   this.updatableData.pop()

   console.log(this.resetData)
}

Answer 2

您可以使用spread syntax 进行浅拷贝。

this.updatableData = [...data];

或Array#slice:

this.updatableData = data.slice();

Answer 3

这就是引用类型。

当您更改引用时，它会影响指向该地址的所有对象。

在古老的 javascript 中，我们曾经像这样复制数组：

var arr = [1,2,3,4];
var arr_copy = [].concat(arr);

arr.pop(); // remove last item from the original array

console.log(arr) // prints [1,2,3]

console.log(arr_copy) // prints [1,2,3,4]

如果您正在寻找跨浏览器的解决方案，这种方法仍然适用。