Start · Sprachen · JavaScript · Referenz · Array.prototype.fill()

Array.prototype.fill()

Methode

Setzt alle Elemente eines Arrays im Indexbereich von <code>start</code> bis ausschließlich <code>end</code> auf einen festen Wert und gibt das veränderte Array zurück.

seit JavaScript ES2015 Kategorie: method-property

Signatur

Array.prototype.fill(value, start, end)

Beschreibung

fill() überschreibt Elemente eines Arrays direkt im Array selbst mit einem festen Wert. Ohne Bereichsangabe betrifft das das ganze Array. Mit start und end legen Sie einen Teilbereich fest. end gehört dabei nicht mehr dazu.

Meistens nutzt man die Methode, um Arrays mit fester Länge vorzubelegen, etwa mit new Array(n).fill(0). Weitere Anwendungen sind das Zurücksetzen von Zählern und Puffern oder das Anlegen von Platzhaltern. Negative Indizes zählen vom Ende des Arrays: -1 steht für das letzte Element.

Die Methode ändert das Array selbst und gibt dasselbe Array zurück, keine Kopie. Die Länge bleibt immer gleich. Indizes außerhalb der Länge werden ignoriert, das Array wird also nicht vergrößert. fill() ist bewusst generisch und funktioniert auch mit Objekten, die Arrays ähneln, also eine length-Eigenschaft haben.

Parameter

Name Typ Default Beschreibung
$value Pflicht any Der Wert für die Elemente. Bei Objekten wird dieselbe Referenz in jede Position geschrieben, keine Kopie.
$start number 0 Startindex, der mit eingeschlossen ist. Negative Werte zählen vom Ende (length + start). Nicht ganzzahlige Werte werden abgeschnitten.
$end number array.length Endindex, der nicht mehr dazugehört. Negative Werte zählen vom Ende. Liegt end bei oder vor start, wird nichts geändert.

Rückgabewert

Typ
Array
Beschreibung
Das veränderte ursprüngliche Array, also dieselbe Referenz und keine Kopie.

Beispiele

Array mit Standardwert vorbelegen

const scores = new Array(5).fill(0);
console.log(scores);
[0, 0, 0, 0, 0]

Nur einen Teilbereich füllen, auch mit negativen Indizes

const seats = ['frei', 'frei', 'frei', 'frei', 'frei', 'frei'];

// Plätze 1 bis 3 reservieren (end = 4 gehört nicht dazu)
seats.fill('belegt', 1, 4);
console.log(seats);

// Die letzten zwei Plätze sperren
seats.fill('gesperrt', -2);
console.log(seats);
['frei', 'belegt', 'belegt', 'belegt', 'frei', 'frei'] ['frei', 'belegt', 'belegt', 'belegt', 'gesperrt', 'gesperrt']

Fallstrick: Objekte werden nicht kopiert

// Falsch: alle Zeilen zeigen auf dasselbe Array
const wrong = new Array(3).fill([]);
wrong[0].push('x');
console.log(wrong);

// Richtig: für jede Position ein neues Array erzeugen
const grid = Array.from({ length: 3 }, () => new Array(3).fill(0));
grid[0][0] = 1;
console.log(grid);
[['x'], ['x'], ['x']] [[1, 0, 0], [0, 0, 0], [0, 0, 0]]

Puffer zurücksetzen und Zahlenfolge erzeugen

const buffer = new Uint8Array([12, 255, 7, 99]);
buffer.fill(0); // TypedArrays haben ebenfalls fill()
console.log(buffer);

// Folge 1 bis 5: fill() macht die Lücken zu echten Elementen, damit map() sie verarbeitet
const range = new Array(5).fill().map((_, i) => i + 1);
console.log(range);
Uint8Array(4) [0, 0, 0, 0] [1, 2, 3, 4, 5]

// Wichtig · Fallstricke

  • Referenzfalle: fill({}) oder fill([]) schreibt überall dasselbe Objekt hinein. Wenn Sie ein Element ändern, ändern sich scheinbar alle. Für getrennte Objekte verwenden Sie Array.from({ length: n }, () => ({})).
  • Ändert das Array selbst: fill() verändert das ursprüngliche Array. Wenn Sie das Original behalten wollen, kopieren Sie es vorher, z. B. mit [...arr].fill(x).
  • Keine Vergrößerung: Die Länge bleibt gleich. [].fill(1) ergibt weiterhin [].
  • Leere Stellen: new Array(n) erzeugt nur leere Stellen, die map() und forEach() überspringen. Erst fill() macht daraus echte Elemente.
  • Auf eingefrorenen Arrays (Object.freeze) wirft fill() im Strict Mode einen TypeError.
  • Kompatibilität: Die Methode gehört seit ES2015 zum Standard und läuft in allen modernen Browsern und in Node.js ab Version 4. Der Internet Explorer unterstützt sie nicht.