如何用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. 代碼塊展示 符合技術文檔的規范格式。