Schieben Sie mehrere Elemente in das Array

284

Ich versuche, mehrere Elemente als ein Array zu verschieben, erhalte jedoch einen Fehler

> a = []
[]
> a.push.apply(null, [1,2])
TypeError: Array.prototype.push called on null or undefined

Ich versuche ähnliche Sachen zu machen, die ich in Ruby machen würde, ich dachte, das applyist so etwas wie *.

>> a = []
=> []
>> a.push(*[1,2])
=> [1, 2]
javascript evfwcqcg
quelle

Antworten:

240

Wenn Sie die meisten Funktionen von Objekten mit applyoder verwenden call, contextMUSS der Parameter das Objekt sein, an dem Sie arbeiten.

In diesem Fall benötigen Sie a.push.apply(a, [1,2])(oder genauer Array.prototype.push.apply(a, [1,2]))

Niet the Dark Absol
quelle
616

Sie können mehrere Elemente auf folgende Weise in ein Array verschieben

var a = [];
    
a.push(1, 2, 3);

console.log(a);
Erweitern Sie das Snippet

amit1310
quelle
1
Diese Antwort und die ausgewählte Antwort führen zu unterschiedlichen und möglicherweise unerwarteten Ergebnissen. a.push (1) gegen a.push ([1])
oevna
1
Kann jemand erklären, warum dies so viel mehr Stimmen hat als die akzeptierte Antwort? Es mag einfacher sein, ist aber weniger flexibel. Wenn Sie 2 Arrays zusammenführen möchten, funktioniert dies nicht.
BluE
@BluE Wenn Sie zwei Arrays zusammenführen möchten, verwenden Sie einfach array.concat ()
Florent Arlandis
@FlorentArlandis array.concat funktioniert nicht, um das zweite Array zum ersten hinzuzufügen. Es wird ein neues erstellt. Ich weiß, dass es ähnlich ist. Der Spread-Operator ist das, wonach ich gesucht habe. Schauen Sie sich einfach die anderen Antworten und Kommentare an, um Details zu erfahren.
BluE
435

In ECMAScript2015 (auch bekannt als ES6) können Sie jetzt mit dem Spread-Operator mehrere Elemente gleichzeitig anhängen:

var arr = [1];
var newItems = [2, 3];
arr.push(...newItems);
console.log(arr);
Erweitern Sie das Snippet

In der ES6-Kompatibilitätstabelle von Kangax finden Sie Informationen zu den kompatiblen Browsern

canac
quelle
41
whaaaaaaat das ist fantastisch, und wenn Sie es in Typoskript tun, wird es zu push.apply kompiliert, so dass Sie Abwärtskompatibilität haben
Chris
72

Sie können verwenden Array.concat:

var result = a.concat(b);
Vision
quelle
16
Array.prototype.concat gibt ein neues Array zurück.
Suricactus
12
Er möchte auf ein vorhandenes Array pushen, daher Array.prototype.push.apply(arr1, arr2)ist dies die richtige Antwort, da arr1.concat(arr2)Sie mit Ihnen ein neues Array erstellen.
Suricactus
3
@suricactus arr1 = arr1.concat(arr2)ist keine große Sache und sieht viel sauberer aus. Das Verschieben auf ein altes Array oder das Ersetzen eines alten Arrays durch ein neues hängt von Ihren Anforderungen ab. Wenn Sie mit mehr als 10 m Elementen arbeiten, die auf ein altes Array verschoben werden, funktioniert dies schneller. Wenn Sie kleine Blöcke verwalten, stellen Sie kaum einen Geschwindigkeitsunterschied fest. Beide Optionen sind völlig legitim.
VisioN
5
@ YuvalA. prototype.push.applyruft nur pusheinmal an. Die obige Unterscheidung ist nicht in Bezug auf die Geschwindigkeit erforderlich, sondern in Bezug auf eine In-Place-Operation und die Erstellung eines neuen Arrays. Was wäre, wenn ich eine Methode hätte, die ein Array verwendet und es an Ort und Stelle ändern sollte? Die concatMethode kann möglicherweise nicht funktionieren, selbst mit dem Code von VisionN, da die Variable für den Aufrufer der Funktion nicht geändert wird.
Coderforlife
1
a = a.concat(b)ist immer noch eine kürzere Syntax alsArray.prototype.push.apply(arr1, arr2)
Aizzat Suhardi
22

Wenn Sie eine Alternative zu Array.concatECMAScript 2015 (auch bekannt als ES6, ES2015) suchen, die das Array nicht ändert, sondern ein neues Array zurückgibt, können Sie den Spread-Operator folgendermaßen verwenden :

var arr = [1];
var newItems = [2, 3];
var newerItems = [4, 5];
var newArr = [...arr, ...newItems, ...newerItems];
console.log(newArr);
Erweitern Sie das Snippet

Beachten Sie, dass dies anders ist als die pushMethode, da die pushMethode das Array mutiert / modifiziert.

Wenn Sie sehen möchten, ob bestimmte ES2015-Funktionen in Ihrem Browser funktionieren, überprüfen Sie die Kompatibilitätstabelle von Kangax .

Sie können auch Babel oder einen ähnlichen Transpiler verwenden, wenn Sie nicht auf die Browserunterstützung warten und ES2015 in der Produktion verwenden möchten.

John
quelle
4

Es gibt viele Antworten zu empfehlen : Array.prototype.push(a, b). Es ist ein guter Weg, ABER wenn Sie ein wirklich großes b haben, haben Sie einen Stapelüberlauffehler (wegen zu vieler Argumente). Sei hier vorsichtig.

Siehe Was ist der effizienteste Weg, um N Arrays zu verketten? für mehr Details.

12kb
quelle
3
Dies gibt keine Antwort auf die Frage. Um einen Autor zu kritisieren oder um Klarstellung zu bitten, hinterlassen Sie einen Kommentar unter seinem Beitrag. [Wie schreibe ich eine gute Antwort? ] ( stackoverflow.com/help/how-to-answer )
mrun
1
Entschuldigung, ich kann keine Kommentare unter den Antworten hinterlassen (außer meinen eigenen), da der Ruf nicht ausreicht :). Aber anscheinend sollte dies hier erwähnt werden, um einen vollständigen Überblick zu haben. Könnten Sie es bitte für mich tun? Dann werde ich meine Antwort entfernen.
12kb
0 
var a=[];
a.push({
 name_a:"abc",
 b:[]
});

a.b.push({
  name_b:"xyz"
});
Alex Kumbhani
quelle