将 JavaScript 中一个对象数组复制到另一个数组

在开发前端应用程序时，经常需要将一个对象数组复制到另一个数组。这篇文章将介绍如何使用 JavaScript 在两个数组之间复制对象数组。

方法一：使用 Array 的 slice() 函数

JavaScript 中的 slice() 函数可以从一个数组中提取元素并将它们添加到新数组中。当从对象数组复制所有元素时，这是一种简单有效的方法。

const sourceArray = [{ id: 1, name: 'John' }, { id: 2, name: 'Jane' }];
const newArray = sourceArray.slice();

在上面的代码中，sourceArray 是要复制的对象数组，而 newArray 是新创建的数组，它包含了所有相同的对象。

这种方法的好处是它相对简单且易于理解。但是，它只适用于浅层拷贝，即对象数组中的每个对象都只是一个简单的键/值对。如果对象数组包含嵌套的对象或者函数，则无法正确地复制它们。

方法二：使用 JSON 和 parse() / stringify() 函数

如果对象数组包含更复杂的嵌套结构，我们可以使用 JSON.parse() 和 JSON.stringify() 函数来实现深层复制。

const sourceArray = [{ id: 1, name: 'John', address: { city: 'New York', state: 'NY' } }, { id: 2, name: 'Jane', address: { city: 'Los Angeles', state: 'CA' } }];
const newArray = JSON.parse(JSON.stringify(sourceArray));

在上面的代码中，JSON.stringify() 函数将对象数组转换为 JSON 字符串，而 JSON.parse() 将其解析回 JavaScript 对象。由于这个过程是深层次的，因此可以正确地复制嵌套结构。

然而，这种方法有一个重要的限制：它无法正确地处理包含函数的对象。如果对象数组中包含函数，则会在复制后丢失。

结论

在大多数情况下，使用 slice() 函数是最简单和最有效的方法来复制对象数组。但是，如果对象数组包含更复杂的嵌套结构，并且我们需要进行深度拷贝，则应该使用 JSON.parse() 和 JSON.stringify() 函数。

不管你选择哪种方法，在将对象数组复制到另一个数组时，请确保清楚地理解它们的限制和适用场景。

示例代码：

// 使用 slice() 函数
const sourceArray = [{ id: 1, name: 'John' }, { id: 2, name: 'Jane' }];
const newArray = sourceArray.slice();

// 使用 parse() / stringify() 函数
const sourceArray = [{ id: 1, name: 'John', address: { city: 'New York', state: 'NY' } }, { id: 2, name: 'Jane', address: { city: 'Los Angeles', state: 'CA' } }];
const newArray = JSON.parse(JSON.stringify(sourceArray));

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/28448