Was ist der Unterschied zwischen .map, .every und .forEach?

118

Ich habe mich immer gefragt, was der Unterschied zwischen ihnen ist. Sie scheinen alle dasselbe zu tun ...

javascript foreach map-function

— 0x499602D2
quelle

6

Jemand hat einen jQuery - Tag ... unter Berücksichtigung everyund forEachsind nicht jQuery Methoden, ich denke , es ist unwahrscheinlich , dass die Frage nach jQuery bezieht sich in keiner Weise. developer.mozilla.org/en/JavaScript/New_in_JavaScript/1.6

— James Allardice

Ich denke, dieser Link sollte die Antwort haben, die Sie suchen.

— zBomb

Habe ich Recht, wenn ich denke, dass Sie sich auf die neuen Mozilla-spezifischen Array-Methoden beziehen, wie im Link in meinem vorherigen Kommentar beschrieben?

— James Allardice

@ James - Diese sind nicht Mozilla-spezifisch . Ich würde auch einen Link zu Webkit- und Opern-Dokumenten teilen, aber ich weiß nicht, wo sie sich auf meinem Kopf befinden.

— Gilly3

@ gilly3 - Ahh, guter Punkt. Ich glaube, dass sie nur in IE9 unterstützt werden, nicht weiter unten.

— James Allardice

223

Der Unterschied liegt in den Rückgabewerten.

.map() Gibt ein neues Array von Objekten zurück, das durch Ausführen einer Aktion für das ursprüngliche Element erstellt wurde.

.every() Gibt einen Booleschen Wert zurück - true, wenn jedes Element in diesem Array die bereitgestellte Testfunktion erfüllt. Ein wichtiger Unterschied .every()besteht darin, dass die Testfunktion möglicherweise nicht immer für jedes Element im Array aufgerufen wird. Sobald die Testfunktion für ein Element false zurückgibt, werden keine Array-Elemente mehr iteriert. Daher sollte die Testfunktion normalerweise keine Nebenwirkungen haben .

.forEach() gibt nichts zurück - Es iteriert das Array und führt eine bestimmte Aktion für jedes Element im Array aus.

Lesen Sie mehr über diese und die vielen anderen Array-Iterationsmethoden bei MDN .

— gilly3
quelle

Alternativ könnte das MDN zitiert werden

— JoshWillik

3

@ Josh - Ich habe MDN zitiert. Jeder Methodenname ist mit der entsprechenden Dokumentation bei MDN verknüpft.

— Gilly3

@ gilly3, ich entschuldige mich, ich beschönigte den blauen Text>.>

— JoshWillik

.forEach () gibt zurück, dass jetzt nichts mehr falsch ist. Vielleicht war es nicht 2012, aber zumindest 2015 in Chrome, versuchen Sie es mit arr2 = ['sue', 'joe', 'ben', 'guy', 'tom', 'jon ']; b = arr2.forEach (Funktion (el, indx) {console.log (indx + ':' + el);}); console.log (b);

— Jason

1

@EugeneMercer Mit "Originalelement" meine ich den Originalwert jedes Elements des Arrays.

— gilly3

88

Die Antwort von gilly3 ist großartig. Ich wollte nur ein paar Informationen über andere Arten von "Loop Through Elements" -Funktionen hinzufügen.

.every() (stoppt die Schleife, wenn der Iterator zum ersten Mal false oder etwas Falsey zurückgibt)
.some() (stoppt die Schleife, wenn der Iterator zum ersten Mal true oder etwas Wahres zurückgibt)
.filter() (Erstellt ein neues Array mit Elementen, bei denen die Filterfunktion true zurückgibt, und diejenigen, bei denen false zurückgegeben wird.)
.map() (Erstellt ein neues Array aus den von der Iteratorfunktion zurückgegebenen Werten.)
.reduce() (baut einen Wert auf, indem der Iterator wiederholt aufgerufen wird und vorherige Werte übergeben werden; Einzelheiten finden Sie in der Spezifikation; nützlich zum Summieren des Inhalts eines Arrays und vieler anderer Dinge)
.reduceRight() (wie reduzieren, funktioniert aber eher in absteigender als in aufsteigender Reihenfolge)

Gutschrift an: TJCrowder Für jeden über ein Array in JavaScript?

— raphaelgontijolopes
quelle

Hol dir 100 Likes von mir!

— Shamim

6

Eine weitere Überlegung zu den oben genannten guten Antworten ist die Verkettung. Mit forEach () können Sie nicht verketten, mit map () jedoch.

Beispielsweise:

var arrayNumbers = [3,1,2,4,5];

arrayNumbers.map(function(i) {
    return i * 2
}).sort();

Mit .forEach () können Sie .sort () nicht ausführen. Es wird eine Fehlermeldung angezeigt.

— Nadine Rose
quelle

0

Für Ramda ist der Unterschied zwischen R.map()und R.forEach():

R.forEach()Gibt das ursprüngliche Array zurück, während R.map()ein Funktor zurückgegeben wird
R.forEach()kann nur mit einem Array arbeiten, R.map()kann aber auch mit einem Objekt arbeiten (dh die Schlüssel / Wert-Paare des Objekts werden wie ein Array behandelt)

— Michael Osofsky
quelle

Die Frage bezieht sich auf die Javascript-Sprache. Ramda ist zwar großartig, aber ein ganz anderes Thema und eine Bibliothek.

— SeaWarrior404