将JavaScript中的数组复制到另一个数组时:
var arr1 = ['a','b','c'];
var arr2 = arr1;
arr2.push('d'); //Now, arr1 = ['a','b','c','d']
我意识到arr2指的是与arr1相同的数组,而不是一个新的独立数组。如何复制阵列以获得两个独立的阵列?
将JavaScript中的数组复制到另一个数组时:
var arr1 = ['a','b','c'];
var arr2 = arr1;
arr2.push('d'); //Now, arr1 = ['a','b','c','d']
我意识到arr2指的是与arr1相同的数组,而不是一个新的独立数组。如何复制阵列以获得两个独立的阵列?
当前回答
这是最新推出的Array.from,但不幸的是,截至本文撰写之时,它仅在最新的Firefox版本(32及更高版本)上受支持。它可以简单地使用如下:
var arr1 = [1, 2, 3];
console.log(Array.from(arr1)); // Logs: [1, 2, 3]
参考:此处
或者Array.prototype.map可以与标识函数一起使用:
function identity(param)
{
return param;
}
var arr1 = [1, 2, 3],
clone = arr1.map(identity);
参考:此处
其他回答
如果您的数组包含原始数据类型的元素,如int、char或string等,那么您可以使用其中一种方法来返回原始数组的副本,如.slice()或.map()或spread运算符(得益于ES6)。
new_array = old_array.slice()
or
new_array = old_array.map((elem) => elem)
or
const new_array = new Array(...old_array);
但是如果您的数组包含复杂元素,例如对象(或数组)或更多嵌套对象,那么,您必须确保从顶层到最后一层复制所有元素,否则将使用内部对象的引用,这意味着更改new_array中object_elements的值仍将影响旧_array。您可以将这种复制方法称为“深度复制”旧数组的。
对于深度复制,您可以根据数据类型在每个级别对原始数据类型使用上述方法,也可以使用这种成本高昂的方法(如下所述)进行深度复制,而无需做大量工作。
var new_array = JSON.parse(JSON.stringify(old_array));
根据您的需求,还有很多其他方法可以使用。我只提到了其中的一些,它们可以让我们大致了解当我们试图按值将一个数组复制到另一个数组时会发生什么。
如果要创建对象或数组的新副本,必须显式复制对象或数组元素的财产,例如:
var arr1 = ['a','b','c'];
var arr2 = [];
for (var i=0; i < arr1.length; i++) {
arr2[i] = arr1[i];
}
您可以在Google上搜索有关不可变原始值和可变对象引用的更多信息。
不需要jQuery。。。工作示例
var arr2 = arr1.slice()
这将从起始位置0到阵列末端复制阵列。
重要的是要注意,它将按照原始类型(字符串、数字等)的预期工作,并解释引用类型的预期行为。。。
如果您有一个引用类型数组,那么就说Object类型。将复制该数组,但这两个数组都将包含对同一对象的引用。因此,在这种情况下,即使实际复制了数组,也似乎通过引用复制了数组。
重要的
这里的大多数答案适用于特定情况。
如果您不关心深度/嵌套对象和道具,请使用(ES6):
let clonedArray=[…array]
但如果要进行深度克隆,请改用以下方法:
let cloneArray=JSON.parse(JSON.stringify(数组))*
*函数在使用stringify时不会被保存(序列化),如果没有它们,您将得到结果。
对于lodash用户:
let clonedArray=_.clone(数组)文档
and
let cloneArray=_.cloneDeep(数组)文档
以下是如何对可变深度的基元数组执行此操作:
// If a is array:
// then call cpArr(a) for each e;
// else return a
const cpArr = a => Array.isArray(a) && a.map(e => cpArr(e)) || a;
let src = [[1,2,3], [4, ["five", "six", 7], true], 8, 9, false];
let dst = cpArr(src);
https://jsbin.com/xemazog/edit?js安慰