Array.prototype.push()

Probieren Sie es aus

const animals = ["pigs", "goats", "sheep"];

const count = animals.push("cows");
console.log(count);
// Expected output: 4
console.log(animals);
// Expected output: Array ["pigs", "goats", "sheep", "cows"]

animals.push("chickens", "cats", "dogs");
console.log(animals);
// Expected output: Array ["pigs", "goats", "sheep", "cows", "chickens", "cats", "dogs"]

Syntax

push()
push(element1)
push(element1, element2)
push(element1, element2, /* , */ elementN)

Parameter

element1, , elementN

Das oder die Elemente, die am Ende des Arrays hinzugefgt werden sollen.

Rckgabewert

Die neue length-Eigenschaft des Objekts, auf dem die Methode aufgerufen wurde.

Beschreibung

Die push()-Methode hngt Werte an ein Array an.

Array.prototype.unshift() hat ein hnliches Verhalten wie push(), wird aber auf den Beginn eines Arrays angewendet.

Die push()-Methode ist eine mutierende Methode. Sie ndert die Lnge und den Inhalt von this. Falls Sie mchten, dass der Wert von this gleich bleibt, aber ein neues Array mit angehngten Elementen zurckgegeben wird, knnen Sie stattdessen arr.concat([element0, element1, /* ... ,*/ elementN]) verwenden. Beachten Sie, dass die Elemente in einem zustzlichen Array eingeschlossen sind andernfalls, falls das Element selbst ein Array ist, wrde es aufgrund des Verhaltens von concat() verbreitet statt als einzelnes Element angehngt.

Die push()-Methode ist generisch. Sie erwartet nur, dass der this-Wert eine length-Eigenschaft und mit Integer-Schlsseln versehene Eigenschaften hat. Obwohl Strings ebenfalls array-hnlich sind, ist diese Methode nicht geeignet, auf sie angewendet zu werden, da Strings unvernderlich sind.

Beispiele

Elemente zu einem Array hinzufgen

Der folgende Code erzeugt das Array sports mit zwei Elementen und fgt dann zwei Elemente hinzu. Die Variable total enthlt die neue Lnge des Arrays.

const sports = ["soccer", "baseball"];
const total = sports.push("football", "swimming");

console.log(sports); // ['soccer', 'baseball', 'football', 'swimming']
console.log(total); // 4

Zwei Arrays zusammenfhren

Dieses Beispiel verwendet die Spread-Syntax, um alle Elemente eines zweiten Arrays in das erste zu pushen.

const vegetables = ["parsnip", "potato"];
const moreVegs = ["celery", "beetroot"];

// Merge the second array into the first one
vegetables.push(...moreVegs);

console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']

Das Zusammenfhren von zwei Arrays kann auch mit der concat()-Methode durchgefhrt werden, die ein neues kombiniertes Array erstellt, anstatt dem Original hinzuzufgen. Die Spread-Syntax funktioniert nur, wenn die Anzahl der Elemente im Array kleiner als die maximale Anzahl von Funktionsargumenten ist, die vom Engine erlaubt sind. Fr lngere Arrays verwenden Sie concat() oder rufen Sie push() mehrfach in einer Schleife auf.

push() auf Objekte, die keine Arrays sind, anwenden

Die push()-Methode liest die length-Eigenschaft von this. Sie setzt dann jeden Index von this, beginnend bei length, mit den an push() bergebenen Argumenten. Schlielich setzt sie die length auf die vorherige Lnge plus die Anzahl der hinzugefgten Elemente.

const arrayLike = {
  length: 3,
  unrelated: "foo",
  2: 4,
};
Array.prototype.push.call(arrayLike, 1, 2);
console.log(arrayLike);
// { '2': 4, '3': 1, '4': 2, length: 5, unrelated: 'foo' }

const plainObj = {};
// There's no length property, so the length is 0
Array.prototype.push.call(plainObj, 1, 2);
console.log(plainObj);
// { '0': 1, '1': 2, length: 2 }

Ein Objekt auf array-hnliche Weise verwenden

Wie oben erwhnt, ist push absichtlich generisch, und das knnen wir zu unserem Vorteil nutzen. Array.prototype.push kann gut auf einem Objekt funktionieren, wie dieses Beispiel zeigt.

Beachten Sie, dass wir kein Array erstellen, um eine Sammlung von Objekten zu speichern. Stattdessen speichern wir die Sammlung im Objekt selbst und verwenden call auf Array.prototype.push, um die Methode zu tuschen, dass wir es mit einem Array zu tun haben und es funktioniert einfach, dank der Art und Weise, wie JavaScript uns erlaubt, den Ausfhrungskontext auf jede gewnschte Weise festzulegen.

const obj = {
  length: 0,

  addElem(elem) {
    // obj.length is automatically incremented
    // every time an element is added.
    [].push.call(this, elem);
  },
};

// Let's add some empty objects just to illustrate.
obj.addElem({});
obj.addElem({});
console.log(obj.length); // 2

Beachten Sie, dass obj zwar kein Array ist, die push-Methode jedoch erfolgreich die length-Eigenschaft von obj erhht hat, als ob wir es mit einem echten Array zu tun htten.

Spezifikationen

Browser-Kompatibilitt

Siehe auch

• Polyfill von Array.prototype.push in core-js mit Korrekturen dieser Methode
• es-shims Polyfill von Array.prototype.push
• Indizierte Sammlungen-Leitfaden
• Array
• Array.prototype.pop()
• Array.prototype.shift()
• Array.prototype.unshift()
• Array.prototype.concat()
• Array.prototype.splice()