前端 js 代码如何初始化数组

数组在JavaScript中是一种灵活且强大的数据结构，用于存储一系列元素。通常通过字面量语法、Array 构造函数、Array.of、Array.from 方法来初始化数组。字面量语法是最常用和直白的方法，通过简单地在方括号内列出元素即可创建数组。

以字面量语法为例，它不仅简洁、直观，而且效率更高。你只需编写类似 let fruits = ['apple', 'banana', 'cherry']; 的代码，就能快速创建一个含有三个字符串元素的数组。这个方法没有额外的函数调用开销，因此在大多数场合下都是首选的数组初始化方式。

字面量语法是创建数组的最简单方法。只需在方括号 ([]) 之间，用逗号分隔你要包含在数组中的元素。

let emptyArray = [];
let fruits = ['Apple', 'Banana', 'Cherry'];

在这里，emptyArray 是一个空数组，而 fruits 是一个包含三个字符串的数组。字面量语法不仅用于初始化数组，还可以在创建后随时修改数组内容。

另一种初始化数组的方式是使用 Array 构造函数。这通常用于创建有特定长度的数组，或是当你有一系列数值时用这些数值作为数组的元素。

let arrayWithLength = new Array(5);
let arrayWithElements = new Array('Apple', 'Banana', 'Cherry');

arrayWithLength 创建了一个长度为5的空数组，而 arrayWithElements 创建了一个含有三个元素的数组。使用构造函数时要注意，如果只有一个数字参数，它会创建一个指定长度的空数组；如果有多个参数或者参数不是数字，则会创建一个包含这些参数的数组。

Array.of 方法可以创建一个包含任意类型参数的新数组。当你想创建只有一个数值元素的数组时，Array.of 特别有用，因为和 Array 构造函数不同，不会因单一数值参数造成混淆。

let arrayWithOneNumber = Array.of(10);
let arrayWithMultipleTypes = Array.of(1, 'two', [3], {four: 4});

这里，arrayWithOneNumber 是一个只包含单一数字 10 的数组，arrayWithMultipleTypes 是一个包含不同类型元素的数组。Array.of 比直接使用 Array 构造函数要直观得多，尤其是在处理单个数字元素的情况。

Array.from 方法允许你从类似数组或可迭代对象（如 arguments 对象、DOM NodeList 对象等）创建新的数组实例。

let arrayFromString = Array.from('hello');
let arrayFromSet = Array.from(new Set(['Apple', 'Banana', 'Cherry']));

arrayFromString 会生成由字符串 'hello' 各字符组成的数组，而 arrayFromSet 则从一个 Set 对象创建数组。Array.from 还可以接受一个映射函数作为第二个参数，允许你在创建数组的同时，对原始数据进行转换。

有时候你可能需要根据特定的条件或数据处理逻辑来初始化数组。

使用循环填充数组

当需要根据某种规则填充数组时，你可以通过循环来初始化数组。
```
let sequence = new Array(10);
for (let i = 0; i < sequence.length; i++) {
    sequence[i] = i * i;
}
```
这段代码创建了一个长度为 10 的数组，并用每个索引的平方来填充这个数组。
使用数组的map方法

类似地，你也可以使用数组的 map 方法结合 Array.from。
```
let sequence = Array.from(new Array(10), (val, index) => index * index);
```
这里使用了 Array.from 的映射功能来初始化一个每个元素都是自身索引平方的数组。
使用扩展运算符

可以用扩展运算符(...)结合 Array.fill 或其他方法来快速复制数组。
```
let original = [1, 2, 3];
let copied = [...original];
```
在此，copied 是 original 的一个浅拷贝。