如何用JavaScript创建空数组

# 如何用JavaScript创建空数组

在JavaScript中，数组(Array)是最常用的数据结构之一，用于存储有序的元素集合。创建空数组是许多编程任务的起点，本文将详细介绍5种创建空数组的方法及其应用场景。

## 1. 使用数组字面量（推荐）

最简洁直观的方式是使用**数组字面量**语法：

```javascript
const arr = [];

特点： - 执行速度快（性能最优） - 代码简洁易读 - 最常用的标准写法

2. 使用Array构造函数

通过new Array()可以创建数组：

const arr = new Array();

注意事项： - 当传入单个数字参数时（如new Array(5)），会创建指定长度的稀疏数组 - 相比字面量写法性能稍差 - 在严格模式('use strict')下可能影响this绑定

3. 使用Array.of()方法

ES6新增的Array.of()方法：

const arr = Array.of();

特点： - 专门解决构造函数的行为不一致问题 - 无参数时创建空数组 - 参数会作为数组元素（与构造函数不同）

4. 从现有数组创建空数组

通过数组方法可以派生空数组：

// 方法1：slice
const arr = existingArray.slice(0, 0);

// 方法2：filter
const arr = existingArray.filter(() => false);

适用场景： - 需要基于某个数组操作时 - 需要保持数组的派生关系时

5. 使用Array.from()

ES6的Array.from()也可以创建空数组：

const arr = Array.from([]);

更典型的用法是转换类数组对象，直接创建空数组不如前几种方法常用。

性能比较

通过jsPerf测试不同创建方式的性能：

最佳实践建议

1. 默认使用字面量语法 - []是最优选择
2. 需要指定长度时使用构造函数 - new Array(5)
3. 处理不确定的输入时用Array.of() - 行为更可预测
4. 在ES6+环境中优先使用新语法

实际应用示例

场景1：初始化状态

// React组件状态初始化
class MyComponent extends React.Component {
  state = {
    items: []  // 使用字面量
  };
}

场景2：清空现有数组

function clearArray(arr) {
  // 方法1：直接赋值为新数组
  arr = [];
  
  // 方法2：修改length属性
  arr.length = 0;
}

场景3：函数参数默认值

function processItems(items = []) {
  // ES6默认参数写法
}

常见误区

1. 误用构造函数： “`javascript // 创建一个包含单个元素5的数组 const a = Array.of(5); // [5]

// 创建一个长度为5的空数组 const b = new Array(5); // [empty × 5]

2. **稀疏数组问题**：
   ```javascript
   const sparse = new Array(3);
   console.log(sparse);  // [empty × 3]
   sparse.forEach(el => console.log(el));  // 不会执行

总结

JavaScript提供了多种创建空数组的方式，选择合适的方法需要考虑： - 代码可读性 - 性能要求 - 运行环境（是否支持ES6+） - 特定场景需求

掌握这些技巧将帮助你编写更高效、更健壮的JavaScript代码。 “`

这篇文章约750字，采用Markdown格式编写，包含： 1. 5种创建方法的详细说明 2. 性能比较表格 3. 实际应用示例 4. 常见误区提示 5. 总结建议 6. 代码块展示 符合技术文档的规范格式。