JavaScript Array fill() Method

Beginner
5 min read
Updated: Nov 2026
3 examples
Array

Definition

Array.prototype.fill(value, start, end) writes one static value into some or all slots. It mutates the array in place (ES2015) and returns the same array.

Remember
array.fill(value)
array.fill(value, start)
array.fill(value, start, end)

end is exclusive (like slice)
mutates in place — returns the same array
new Array(n).fill(x) → initialize n slots

avoid fill({}) — one shared object in every slot

Syntax

Call array.fill. Start with this line.

JavaScript
array.fill(value, start=0, end=length)
CallWhat it does
array.fill(value, start=0, end=length)Primary signature.
array.fill(...)Call with the arguments your case needs.

Built into JavaScript. Call fill(...) on an array instance — no import required.

Library declarations
JavaScript
array.fill(value, start=0, end=length)

Parameters

ParameterDescription
valueRequired. Static value written into each slot
startOptional. First index to fill (default 0)
endOptional. Stop before this index (default length)

Return Value

Return ValueDescription
*The same mutated array

JavaScript Examples

Example 1 — Fill a Range

Overwrite indexes 1…3 with 10 (end exclusive).

JavaScript
const numbers = [1, 2, 3, 4, 5];
numbers.fill(10, 1, 4);

console.log(numbers);  // [1, 10, 10, 10, 5]
Try It Yourself

How It Works

  1. Start with five numbers. Indexes run 0 … 4.
  2. Set the range. start=1, end=4 means write while i < 4.
  3. Overwrite three slots. Indexes 1, 2, 3 become 10.
  4. Ends stay put. Index 0 and 4 keep their original values.

Example 2 — Fill the Entire Array

Reset every element with one call—no start/end needed.

JavaScript
const scores = [88, 92, 75, 60];
scores.fill(0);

console.log(scores);  // [0, 0, 0, 0]
Try It Yourself

How It Works

  1. Omit the range. Defaults are start=0 and end=length.
  2. Every slot updates. All four scores become 0.
  3. Same array. scores is mutated; no new array is created.
  4. Clone if needed. Use [...scores].fill(0) to keep the original.

Example 3 — Initialize a Fixed-Length Array

Create n slots of the same primitive—great for buffers and placeholders.

JavaScript
const grid = new Array(8).fill(0);

console.log(grid);
console.log("length:", grid.length);

// Tip: for independent objects use Array.from, not fill({})
const cells = Array.from({ length: 3 }, () => ({}));
cells[0].marked = true;
console.log(cells);
Try It Yourself

How It Works

  1. Allocate length. new Array(8) creates eight empty slots.
  2. Fill primitives. fill(0) writes 0 into each slot safely.
  3. Objects need care. fill({}) would share one object—avoid it.
  4. Independent objects. Array.from with a factory gives a new {} per index.

Browser & Runtime Support

Array.prototype.fill() is part of ES2015 (ES6). It has been available in evergreen browsers for years and in Node.js since version 4.

✓ Baseline · ES2015

Array.prototype.fill()

Supported in Chrome 45+, Firefox 31+, Safari 9+, Edge 12+, and Node 4+. Not available in Internet Explorer.

98% Modern browser support
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Bun Supported · JavaScript runtime
Supported
Deno Supported · JavaScript runtime
Supported
Node.js Supported · Server runtime
Supported
Android WebView Supported · Modern WebView
Full support
Array.fill() Excellent

Bottom line: Safe for essentially all modern web and Node targets. Only skip it if you must support Internet Explorer without a polyfill.

Frequently Asked Questions

fill() sets some or all elements of an array to a single static value. It modifies the array in place and returns the same array reference.
Yes. fill() overwrites existing slots in the array you call it on. Clone first with spread or slice if you need to preserve the original.
end is exclusive, like slice and copyWithin. fill(value, 1, 4) writes at indexes 1, 2, and 3—not index 4.
fill() always works on an existing array. A common pattern is new Array(length).fill(value) to initialize a fixed-size array, or [...arr].fill(value) to fill a copy.
fill() stores the same object reference in every slot. Mutating one element mutates all of them. Use Array.from({ length: n }, () => ({})) for independent objects.
fill() is an ES2015 (ES6) feature. All modern browsers support it; Internet Explorer does not.

Next: filter()

Keep only the elements that pass your test callback.

filter() tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

11 people found this page helpful