JavaScript数组复制：`new Array(...arr)`与`[...arr]`的区别详解

本文详解JavaScript中两种数组复制方法`new Array(...arr)`和`[...arr]`的区别。`new Array(...arr)`在参数为单个数字（例如`[1]`）时，会产生一个空数组而非预期结果，这是因为`Array`构造函数的特殊行为。而`[...arr]`（展开语法）则能可靠地复制数组所有元素，无论其内容如何。文章深入分析了两种方法的原理和差异，并推荐开发者优先使用更安全、直观的`[...arr]`进行数组复制，避免`new Array(...arr)`潜在的歧义。

JavaScript数组复制：[...arr]与new Array(...arr)的差异及最佳实践

在JavaScript中复制数组看似简单，实则暗藏陷阱。本文深入探讨let array = new Array(...arr)这种复制方法，尤其关注arr为[1]时，array为空数组的特殊情况，并对比[...arr]与new Array(...arr)两种方法的优劣。

let array = new Array(...arr)在arr为[1]时，结果为空数组，并非直观预期的[1]。这是因为new Array()构造函数的行为并非简单的数组复制。当new Array()仅接收一个数字参数时，它创建的是一个长度为该数字的空数组，而非包含该数字的数组。因此，...arr展开为1，new Array(1)生成一个长度为1的空数组。

要理解此差异，需参考JavaScript官方文档，了解Array构造函数的多种用法：它可接收多个参数创建数组，接收一个数字参数指定数组长度，或不接收参数创建空数组。这与数组字面量[]或[...]有本质区别。

[...arr]，即展开语法，将arr的所有元素复制到一个新数组。无论arr包含什么，[...arr]都创建一个包含这些元素的新数组。例如，arr为[1]时，[...arr]结果为[1]，符合预期。

因此，new Array(...arr)和[...arr]的主要区别在于：前者使用Array构造函数，单个数字参数时创建空数组；后者使用展开语法，创建包含原数组所有元素的新数组，更安全、更符合直觉。 建议在实际开发中优先使用[...arr]进行数组复制，避免new Array()在参数为单个数字时产生的歧义。

以上就是《JavaScript数组复制：`new Array(...arr)`与`[...arr]`的区别详解》的详细内容，更多关于的资料请关注golang学习网公众号！