JavaScript Array fill() (填充陣列)

陣列 (array) 的 fill() 方法用來將陣列中的所有元素（或指定範圍的元素）都填入一個固定的值。此方法會修改原陣列。

語法：

arr.fill(value[, start[, end]])

• value 是用來填充的值
• start 是可選的起始索引，預設是 0
• end 是可選的結束索引（不含），預設是陣列長度

基本用法

var arr = [1, 2, 3, 4, 5];

arr.fill(0);
console.log(arr);  // [0, 0, 0, 0, 0]

指定填充範圍

var arr = [1, 2, 3, 4, 5];

// 從索引 2 開始填充到結尾
arr.fill(0, 2);
console.log(arr);  // [1, 2, 0, 0, 0]

var arr = [1, 2, 3, 4, 5];

// 從索引 1 填充到索引 3（不含）
arr.fill(0, 1, 3);
console.log(arr);  // [1, 0, 0, 4, 5]

建立並初始化陣列

// 建立長度為 5 的陣列，全部填入 0
var zeros = new Array(5).fill(0);
console.log(zeros);  // [0, 0, 0, 0, 0]

// 建立預設值陣列
var defaults = new Array(3).fill('default');
console.log(defaults);  // ['default', 'default', 'default']

注意：填充物件會是同一個參考

// 錯誤示範：所有元素都指向同一個物件
var arr = new Array(3).fill({});
arr[0].name = 'Mike';
console.log(arr);
// [{ name: 'Mike' }, { name: 'Mike' }, { name: 'Mike' }]
// 三個都是同一個物件！

// 正確做法：使用 Array.from() 或 map()
var arr = Array.from({ length: 3 }, function() {
    return {};
});
arr[0].name = 'Mike';
console.log(arr);
// [{ name: 'Mike' }, {}, {}]

實際應用

// 重設分數
var scores = [85, 90, 78, 92, 88];
scores.fill(0);  // 全部歸零

// 建立棋盤初始狀態
var board = new Array(9).fill(null);
// [null, null, null, null, null, null, null, null, null]

// 建立二維陣列（注意要用正確方式）
var grid = Array.from({ length: 3 }, function() {
    return new Array(3).fill(0);
});
// [[0, 0, 0], [0, 0, 0], [0, 0, 0]]