---
title: Array.prototype.push()
slug: Web/JavaScript/Reference/Global_Objects/Array/push
tags:
  - Array
  - JavaScript
  - Method
  - Prototype
  - Reference
translation_of: Web/JavaScript/Reference/Global_Objects/Array/push
---
<div>{{JSRef}}</div>

<p>Die <code><strong>push()</strong></code> Methode fügt ein oder mehr Elemente am Ende eines Arrays hinzu und gibt die neue Länge des Arrays zurück.</p>

<div>{{EmbedInteractiveExample("pages/js/array-push.html")}}</div>



<h2 id="Syntax" name="Syntax">Syntax</h2>

<pre class="syntaxbox"><code><var>arr</var>.push(<var>element1</var> [, ... [, <var>elementN]]</var>)</code></pre>

<h3 id="Parameters" name="Parameters">Parameter</h3>

<dl>
 <dt><code>element<em>N</em></code></dt>
 <dd>Die Elemente, die am Ende des Arrays eingefügt werden.</dd>
</dl>

<h3 id="Returns" name="Returns">Rückgabewert</h3>

<p>Den neuen Wert der {{jsxref("Array.length", "length")}} Eigenschaft (Länge des Arrays), nachdem die Methode ausgeführt wurde.</p>

<h2 id="Beschreibung">Beschreibung</h2>

<p>Die <code>push</code> Methode fügt Werte an das Ende eines Arrays an.</p>

<p class="p1"><code>push</code> ist absichtlich generisch gehalten. Die Methode kann mit Hilfe von {{jsxref("Function.call", "call()")}} und {{jsxref("Function.apply", "apply()")}} auch auf Array ähnliche Objekte angewendet werden. Die Methode wählt anhand der <code>length</code> Eigenschaft den Punkt aus, an dem die Werte eingefügt werden. Falls die <code>length</code> Eigenschaft nicht in eine Zahl umgewandelt werden kann, wird 0 als Index verwendet. Das gilt auch für den Fall, dass die <code>length</code> Eigenschaft nicht vorhanden ist. Die <code>length</code> Eigenschaft wird daraufhin erstellt.</p>

<p class="p2">Obwohl {{jsxref("Global_Objects/String", "Strings", "", 1)}} native, Array-ähnliche Objekte sind, sind sie in Anwendungen dieser Methode nicht geeignet, da Strings unveränderlich sind. Gleiches gilt für das native, Array-ähnliche Objekt {{jsxref("Functions/arguments", "arguments", "", 1)}}.</p>

<h2 id="Examples" name="Examples">Beispiele</h2>

<h3 id="Example:_Adding_elements_to_an_array" name="Example:_Adding_elements_to_an_array">Elemente zu einem Array hinzufügen</h3>

<p>Der folgende Quelltext erstellt ein <code>sports</code> Array mit zwei Elementen und fügt anschließend zwei weitere Elemente hinzu. Die Variable <code>total</code> enthält die neue Länge des Arrays.</p>

<pre class="brush: js">var sports = ['soccer', 'baseball'];
var total = sports.push('football', 'swimming');

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

<h3 id="Zwei_Arrays_zusammenführen">Zwei Arrays zusammenführen</h3>

<p>Dieses Beispiel benutzt {{jsxref("Function.apply", "apply()")}}, um alle Elemente eines zweiten Arrays hinzuzufügen.</p>

<p>Diese Methode sollte <em>nicht</em> benutzt werden, wenn das zweite Array (<code>moreVegs</code> in diesem Beispiel) sehr lang ist, weil die maximale Anzahl der Parametern, die eine Funktion haben kann, in der Praxis limitiert ist. Siehe {{jsxref("Function.apply", "apply()")}} für mehr Details.</p>

<pre>var vegetables = ['parsnip', 'potato'];
var moreVegs = ['celery', 'beetroot'];

// Fügt das zweite Array an das erste Array an
// Equivalent zu vegetables.push('celery', 'beetroot');
Array.prototype.push.apply(vegetables, moreVegs);

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

<h3 id="Objekte_wie_ein_Array_behandeln">Objekte wie ein Array behandeln</h3>

<p>Wie oben angedeutet ist, ist <code>push</code> extra generisch gehalten, was man zu seinem Vorteil nutzen kann. <code>Array.prototype.push</code> kann gut auf ein Objekt angewendet werden, wie das Beispiel zeigt. Zu beachten ist, dass kein Array erstellt wird, um eine Menge von Objekten zu speichern. Stattdessen werden die Objekte in dem Objekt selbst gespeichern, indem wir <code>call</code> auf der <code>Array.prototype.push</code> Methode einsetzen, um die Methode glauben zu lassen, wir arbeiten mit einem Array. Es funktioniert einfach, dank der Art und Weise, wie JavaScript es uns erlaubt, den Ausführungskontext nach Belieben festzulegen.</p>

<pre class="brush: js">var obj = {
    length: 0,

    addElem: function addElem(elem) {
        // obj.length wird automatisch erhöht,
        // wenn ein Objekt hinzugefügt wird
        [].push.call(this, elem);
    }
};

// ein paar leere Objekte zu Illustrationszwecken hinzufügen
obj.addElem({});
obj.addElem({});
console.log(obj.length);
// → 2
</pre>

<p>Zu beachten ist, dass <code>obj</code> kein Array ist. Die Methode <code>push</code> erhöht erfolgreich die <code>length</code> Eigenschaft von <code>obj</code>, so als würde sie mit einem Array arbeiten.</p>

<h2 id="Specifications" name="Specifications">Spezifikationen</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Spezifikation</th>
   <th scope="col">Status</th>
   <th scope="col">Kommentar</th>
  </tr>
  <tr>
   <td>{{SpecName('ES3')}}</td>
   <td>{{Spec2('ES3')}}</td>
   <td>Initiale Definition. Implementiert in JavaScript 1.2.</td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-15.4.4.7', 'Array.prototype.push')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">Browserkompatibilität</h2>

<div>


<p>{{Compat("javascript.builtins.Array.push")}}</p>
</div>

<h2 id="See_also" name="See_also">Siehe auch</h2>

<ul>
 <li>{{jsxref("Array.prototype.pop()")}}</li>
 <li>{{jsxref("Array.prototype.shift()")}}</li>
 <li>{{jsxref("Array.prototype.unshift()")}}</li>
 <li>{{jsxref("Array.prototype.concat()")}}</li>
</ul>