数组创建与初始化

在JavaScript中，数组是一种基础且强大的数据结构，用于存储有序的元素集合。数组的创建和初始化方式多样，灵活运用这些方法可以显著提升开发效率。

数组字面量创建

最直接的方式是使用数组字面量语法，通过方括号[]定义元素：

// 空数组
const emptyArr = [];

// 包含初始元素的数组
const fruits = ['apple', 'banana', 'orange'];

// 混合类型数组
const mixed = [1, 'text', true, { key: 'value' }];

使用Array构造函数

通过new Array()可以创建数组，但需要注意参数的特殊行为：

// 创建包含3个空位的数组
const arr1 = new Array(3); // [empty × 3]

// 创建包含单个数字元素的数组
const arr2 = new Array(3.5); // [3.5]

// 创建多元素数组
const arr3 = new Array('a', 'b', 'c'); // ['a', 'b', 'c']

ES6新增的Array.of方法

解决构造函数参数歧义问题：

Array.of(3);      // [3]
Array.of(1, 2, 3); // [1, 2, 3]

Array.from方法

将类数组对象或可迭代对象转换为数组：

// 字符串转数组
Array.from('hello'); // ['h', 'e', 'l', 'l', 'o']

// Set转数组
Array.from(new Set([1, 2, 2, 3])); // [1, 2, 3]

// 带映射函数
Array.from([1, 2, 3], x => x * 2); // [2, 4, 6]

填充数组的常用方法

fill方法初始化

// 创建并填充长度为5的数组
const filled = new Array(5).fill(0); // [0, 0, 0, 0, 0]

// 指定填充范围
const partialFill = ['a', 'b', 'c', 'd'];
partialFill.fill('*', 1, 3); // ['a', '*', '*', 'd']

使用map初始化

// 创建序列数组
const sequence = Array(5).fill().map((_, i) => i + 1); // [1, 2, 3, 4, 5]

// 生成随机数数组
const randoms = Array(3).fill().map(() => Math.random());

多维数组初始化

创建二维数组需要注意引用问题：

// 错误方式（所有行引用相同数组）
const wrongMatrix = new Array(3).fill(new Array(3).fill(0));

// 正确方式
const matrix = Array.from({ length: 3 }, () => 
  new Array(3).fill(0)
);

// 初始化三维数组
const cube = Array.from({ length: 3 }, () =>
  Array.from({ length: 3 }, () => 
    new Array(3).fill(null)
  )
);

特殊数组创建技巧

生成数值范围数组

// 生成1-10的数组
const range1 = [...Array(10).keys()].map(i => i + 1);

// 使用生成器函数
function* generateRange(start, end) {
  for (let i = start; i <= end; i++) yield i;
}
const range2 = [...generateRange(5, 8)]; // [5, 6, 7, 8]

创建稀疏数组

// 显式创建空位数组
const sparse = [1, , , 4]; // [1, empty × 2, 4]

// 注意空位与undefined的区别
const withUndefined = [1, undefined, undefined, 4];

性能优化建议

大规模数组初始化时，直接设置length比push更高效：

// 高效方式
const bigArr = [];
bigArr.length = 1000000;

// 低效方式
const slowArr = [];
for (let i = 0; i < 1000000; i++) {
  slowArr.push(i);
}

现代JavaScript的新特性

ES2023新增的Array.with()方法可以非破坏性修改数组：

const original = [1, 2, 3];
const modified = original.with(1, 99); // [1, 99, 3]