深入解析JS数组创建的多种方式：new Array()、Array.of()、Array.from()

2023-10-06 08:00:07

前言

数组是JavaScript中一种基础的数据结构，用于存储一组有序的数据。在实际项目中，我们经常需要创建数组来存储各种类型的数据。JavaScript提供了多种创建数组的方法，包括：

每种方法都有其独特的特点和使用场景。本文将详细解析这三种方法，帮助您全面理解它们之间的异同点，以便在实际项目中更灵活地选择适合的数组创建方法。

new Array()

new Array()是创建数组最基本的方法，它可以接收一个数字参数，指定数组的长度，也可以不接收参数，创建一个空数组。例如：

const array1 = new Array(); // 空数组
const array2 = new Array(5); // 长度为5的数组

new Array()方法创建的数组是一个稀疏数组，这意味着数组中可以存在空元素。例如，以下代码创建了一个长度为5的数组，但只有第一个元素有值：

const array3 = new Array(5);
array3[0] = 1;

如果我们访问数组3的第二个元素，则会返回undefined：

console.log(array3[1]); // undefined

Array.of()方法是ES6中引入的，它可以接收任意数量的参数，并将其转换为一个数组。例如：

const array4 = Array.of(1, 2, 3, 4, 5);

与new Array()方法不同的是，Array.of()方法创建的数组是一个稠密数组，这意味着数组中不会存在空元素。即使我们不指定数组的长度，Array.of()方法也会创建一个长度与参数数量相同的数组。例如：

const array5 = Array.of(); // 空数组

Array.from()方法也是ES6中引入的，它可以将其他数据结构转换为数组。例如，我们可以将一个字符串、一个NodeList或一个Map转换为数组。语法如下：

Array.from(object, mapFn, thisArg)

其中：

例如，我们可以将一个字符串转换为数组：

const array6 = Array.from('hello');

或者，我们可以使用映射函数将每个字符转换为大写：

const array7 = Array.from('hello', (char) => char.toUpperCase());

下表总结了这三种数组创建方法的主要区别：

方法	语法	创建稀疏数组	创建稠密数组	接收任意数量的参数	可以将其他数据结构转换为数组
`new Array()`	`new Array(length)`	是	否	否	否
`Array.of()`	`Array.of(...elements)`	否	是	是	否
`Array.from()`	`Array.from(object, mapFn, thisArg)`	取决于object	取决于object	取决于object	是