Widely available すべての主要ブラウザで対応済み。安心して使用可能。

Array fill()

fill() は Array インスタンスのメソッドで、インデックスの範囲内にある配列のすべての要素を一定の値に変更します。これは変更した配列を返します。

配列ES2015

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
Array.fill
45
12
31
8
45
8
TypedArray.fill

fill() は TypedArray インスタンスのメソッドで、型付き配列のある範囲のインデックスにあるすべての要素を固定値で埋めます。これは変更された型付き配列を返します。このメソッドのアルゴリズムは Array.prototype.fill() と同じです。
45
12
37
10
45
10
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT 
// Initializing an array
new Array(5).fill(0); // [0, 0, 0, 0, 0]

// Partially filling an array
[1, 2, 3, 4, 5].fill(9, 2, 4); // [1, 2, 9, 9, 5]

ライブデモ

配列の初期化

指定した長さの配列を作成し、全て同じ値で埋めます。

プレビュー全画面表示

範囲を指定して埋める

開始位置と終了位置を指定して、特定の部分だけを書き換えます。

プレビュー全画面表示

データの初期化（リセット）

既存の配列データを一括でリセットする実用的な例です。

プレビュー全画面表示

実務での使いどころ

  • Array fill() の活用

    fill() は Array インスタンスのメソッドで、インデックスの範囲内にある配列のすべての要素を一定の値に変更します。

注意点

  • 特になし。すべての主要ブラウザで安定して動作する。

アクセシビリティ

  • JavaScript による動的更新時は、aria-live リージョンで変更をスクリーンリーダーに通知する。

参考リンク