fill() メソッドは、配列中の開始位置から終了位置までの要素を固定値で設定します。その際、終了位置は含まれません。

構文

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

引数

value
配列に設定する値です。
start Optional
開始する位置です。既定値は 0 です。
end Optional
終了する位置です。既定値は this.length です。

戻り値

変更された配列です。

説明

fill メソッドは最大 3 つの引数 valuestartend をとります。startend はオプションの引数で、既定値はそれぞれ 0this オブジェクトの length です。

start が負の値の場合、length+start として扱われます (length は配列の長さ)。end が負の値の場合、length+end として扱われます。

fill 関数はジェネリック関数であり、this が配列オブジェクトである必要はありません。

fill メソッドは可変メソッドで、this オブジェクト自身を変更し、オブジェクト自身のコピーではなく、オブジェクト自身を返します。

fill にオブジェクトを渡した場合、そのオブジェクトへの参照がコピーされ、配列に参照が書き込まれます。

[1, 2, 3].fill(4);               // [4, 4, 4]
[1, 2, 3].fill(4, 1);            // [1, 4, 4]
[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
Array(3).fill(4);                // [4, 4, 4]
[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}

// Objects by reference.
var arr = Array(3).fill({}) // [{}, {}, {}];
arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]

Polyfill

【訳注: Polyfill とは、ある機能をサポートしていないブラウザーで相当機能を実装するための各種テクニックのことです。】

if (!Array.prototype.fill) {
  Object.defineProperty(Array.prototype, 'fill', {
    value: function(value) {

      // Steps 1-2.
      if (this == null) {
        throw new TypeError('this is null or not defined');
      }

      var O = Object(this);

      // Steps 3-5.
      var len = O.length >>> 0;

      // Steps 6-7.
      var start = arguments[1];
      var relativeStart = start >> 0;

      // Step 8.
      var k = relativeStart < 0 ?
        Math.max(len + relativeStart, 0) :
        Math.min(relativeStart, len);

      // Steps 9-10.
      var end = arguments[2];
      var relativeEnd = end === undefined ?
        len : end >> 0;

      // Step 11.
      var final = relativeEnd < 0 ?
        Math.max(len + relativeEnd, 0) :
        Math.min(relativeEnd, len);

      // Step 12.
      while (k < final) {
        O[k] = value;
        k++;
      }

      // Step 13.
      return O;
    }
  });
}

Object.defineProperty が利用できないとても古い JavaScript エンジンをサポートする必要がある場合、Array.prototype のメソッドを polyfill するのは避けたほうがよいでしょう。それらを列挙不可にすることができないからです。

仕様

仕様 ステータス コメント
ECMAScript 2015 (6th Edition, ECMA-262)
Array.prototype.fill の定義
標準 初期定義
ECMAScript Latest Draft (ECMA-262)
Array.prototype.fill の定義
ドラフト  

ブラウザー実装状況

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
fillChrome 完全対応 45Edge 完全対応 12Firefox 完全対応 31IE 未対応 なしOpera 完全対応 ありSafari 完全対応 8WebView Android 完全対応 ありChrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 31Opera Android 完全対応 ありSafari iOS 完全対応 8Samsung Internet Android 完全対応 ありnodejs 完全対応 4.0.0
完全対応 4.0.0
完全対応 0.12
無効
無効 From version 0.12: this feature is behind the --harmony runtime flag.

凡例

完全対応  
完全対応
未対応  
未対応
ユーザーが明示的にこの機能を有効にしなければなりません。
ユーザーが明示的にこの機能を有効にしなければなりません。

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mdnwebdocs-bot, segayuu, unarist, taiyaki32lp64, dskmori, shide55
最終更新者: mdnwebdocs-bot,