array.fill

The fill() method fills all the elements of an array from a start index to an end index with a static value.

var numbers = [1, 2, 3]
numbers.fill(1);

// results in [1, 1, 1]

Syntax

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

Parameters

value

Value to fill an array.

start Optional

Start index, defaults to 0.

end Optional

End index, defaults to this.length.

Return value

The modified array.

Description

The elements interval to fill is [start, end).

The fill method takes up to three arguments value, start and end. The start and end arguments are optional with default values of 0 and the length of the this object.

If start is negative, it is treated as length+start where length is the length of the array. If end is negative, it is treated as length+end.

The fill function is intentionally generic, it does not require that its this value be an Array object.

The fill method is a mutable method, it will change this object itself, and return it, not just return a copy of it.

Examples

[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, -2);       // [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
Array(3).fill(4);                // [4, 4, 4]
[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}

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;
    }
  });
}

If you need to support truly obsolete JavaScript engines that don't support Object.defineProperty, it's best not to polyfill Array.prototype methods at all, as you can't make them non-enumerable.

Specifications

Specification	Status	Comment
ECMAScript 2015 (6th Edition, ECMA-262) The definition of 'Array.prototype.fill' in that specification.	Standard	Initial definition.
ECMAScript 2017 Draft (ECMA-262) The definition of 'Array.prototype.fill' in that specification.	Draft

Browser compatibility

[1] Starting with Chrome 36, this was available behind a preference. In chrome://flags, activate the entry “Enable Experimental JavaScript”.

See also

• Array
• TypedArray.prototype.fill()