如何克隆Javascript对象数组？

我有一个结果集，它是一个对象数组。 我需要克隆它，以便我可以对其进行更改，而无需触及原始数据。

var data = w2ui.grid.records, exclude = Array('recid', 'w2ui'); // Exclude these data points from the pivot // Modify our tempData records to remove HTML $.each(data, function(key, value) { $.each(value, function(_key, _value) { if(jQuery.inArray(_key, exclude) != -1) { delete data[key][_key]; }else{ data[key][_key] = $('
'+_value+'
').text(); // 
 for those which are simply strings. } }); }); 

在这个例子中，我创建了一个名为data的变量，并将其设置为我的“源数据”。

我希望能够对这个新的数据变量进行更改，但看起来在更改它时，源数据正在被更改（ w2ui.grid.records ）。

有没有正确的方法来克隆这个集合，所以我可以有一个新的数据实例来修改？

Answer 1

编辑

深度克隆使用JSON.parse(JSON.stringify(arr));

浅克隆使用slice(0);

 var arr = [{'obj1':1}, {'obj2':2}]; var clone = arr.slice(0); console.log(clone); 

Answer 2

有各种方法可以做到 –

 let arr = [{ 'obj1': 1 }, { 'obj2': 2 }]; // 1 const arr2 = arr.slice(); console.log(arr2); // 2 const arr3 = [].concat(arr); console.log(arr3); // 3 // or use the new ES6 Spread const arr4 = [...arr]; console.log(arr4); // 4 const arr5 = Array.from(arr); console.log(arr5); 

Answer 3

既然你正在使用jquery，你可以试试extend ：

 var arr = [{'obj1':1}, {'obj2':2}]; var clone = jQuery.extend(true, [], arr); clone[0]['obj1']=10; console.log(clone); console.log(arr); 

Answer 4

Lodash有一种专门用于此方法的方法，称为clonedeep 。 如果您不想拉入整个库，那么它有一个独立的包：

https://www.npmjs.com/package/lodash.clonedeep

Answer 5

这是因为数组被保存为指针，因此设置新变量只是指向同一个数组。

我所知道的最简单的方法是用切片…

 var data = w2ui.grid.records.slice(0); 

这将创建一个包含所有原始值的新数组，因为您正在从第一个（0）切片。

如果你需要深度克隆，因为你的数组也包含对象/数组，试试这个……

https://github.com/pvorb/clone

Answer 6

您可以通过ES6传播运营商实现这一目标

 var arr1 = [1] var arr2 = arr1 arr1 === arr2 //true arr2.push(2) arr2 //[1, 2] arr1 //[1, 2] var arr3 = [...arr1] //create a copy of existing array arr1 === arr3 //false arr2 === arr3 //false arr3.push(3) arr3 //[1, 2, 3] arr1 //[1, 2] arr2 //[1, 2] 

同样的语法也可以用于javascripts对象

var newObj = [… existingObj]

Answer 7

我使用新的ES6 Object.assign方法：

 let oldObject = [1,3,5,"test"]; let newObject = Object.assign({}, oldObject); 

这个方法的第一个参数是要更新的数组，我传递一个空对象，因为我想要一个新的新对象。

我们也可以使用以下语法，它们相同但更短：

 let newObject = [...oldObject]; 

Answer 8

ES6：

如果您还想拥有克隆对象，则必须传播数组和对象：

 const newArrayOfObjects = [ ...originalArrayOfObject ].map(i => ({ ...i}));