如何在JavaScript中克隆一个数组？

JavaScript提供了很多克隆数组的方法，大多数方法在性能和结果方面都相似。以下是一些可用选项的快速概述。

扩展运算符

ES6引入了扩展运算符（...），它提供了可能是创建数组浅拷贝最简单和最常见的方法。

let x = [1, 2, 3, 4];
let y = [...x];

Array.from()具有非常强大的API，可用于许多不同的操作，包括创建数组的副本。

let x = [1, 2, 3, 4];
let y = Array.from(x);

与扩展运算符类似，Array.prototype.slice()可用于创建数组的浅拷贝。

let x = [1, 2, 3, 4];
let y = x.slice();

在查看一些不太常见的选项时，可以使用Array.prototype.map()将数组的每个元素映射到自身，从而创建一个新数组。

let x = [1, 2, 3, 4];
let y = x.map(i => i);

类似地，Array.prototype.filter()可以用于对每个元素返回true，从而得到一个包含原始数组所有元素的新数组。

let x = [1, 2, 3, 4];
let y = x.filter(() => true);

最后，Object.assign()可以以与创建对象的方式相同的方式用于创建数组的克隆。

let x = [1, 2, 3, 4];
let y = Object.assign([], x);

如果你想克隆一个包含对象、函数或类实例的数组，你可以使用structuredClone()全局函数，它可以用来深度克隆对象。

const a = [{ foo: 'bar' }, { baz: 'qux' }];
const b = structuredClone(a); // a !== b, a[0] !== b[0]

[!NOTE]

structuredClone()函数是语言中相对较新的添加。即便如此，它被所有现代浏览器和Node.js自v17.0.0起支持。