Skip to main content
Es gibt viele verschiedene Methoden, um in JavaScript über Arrays zu loopen. Dabei ist jede Methode für etwas anderes zuständig.

​
forEach()

Die forEach()-Methode ruft für jedes Element eine Callback-Funktion auf. In der Callback-Funktion haben wir Zugriff auf drei Parameter:
  • cur: Das aktuelle Element
  • index: Den Index des aktuellen Elements
  • arr: Der gesamte Array
movements.forEach((movement, index, array) => {
  if (movement > 0) {
    console.log(`Movement ${index + 1}: You deposited ${movement}`);
  } else {
    console.log(`Movement ${index + 1}: You withdrew ${Math.abs(movement)}`);
  }
});
Bei der forEach()-Methode können wir den Loop nicht abbrechen oder überspringen.

​
map()

Die map()-Methode funktioniert ähnlich wie die forEach()-Methode. Sie geht durch jedes Element im Array durch und führt eine bestimmte Callback-Methode aus.
Im Gegensatz zur genannten forEach()-Methode gibt uns map() einen neuen Array mit den Resultaten der angewandten Operation zurück.
Wie auch bei der forEach()-Methode haben wir Zugriff auf:
  • cur: Das aktuelle Element
  • index: Den Index des aktuellen Elements
  • arr: Der gesamte Array
const movementsInEuro = [200, 450, -400, 3000, -650, -130, 70, 1300];
const euroToUsdConversionRate = 1.1;

const movementsInUsd = movementsInEuro.map(
  (movement) => movement * euroToUsdConversionRate
);

​
filter()

Die filter()-Methode ist dafür da, um bestimmte Elemente aus einem Array herauszufiltern.
filter() gibt uns einen neuen Array zurück, welcher den Anforderungen der Kondition entspricht.
const movements = [200, 450, -400, 3000, -650, -130, 70, 1300];

const deposits = movements.filter((movement) => movement > 0);
const withdrawals = movements.filter((movement) => movement < 0);

​
reduce()

Die reduce()-Methode “reduziert” alle Elemente eines Arrays auf einen Wert hinab. 
const movements = [200, 450, -400, 3000, -650, -130, 70, 1300];
const balance = movements.reduce((acc, cur) => acc + cur, 0);
Die Methode erwartet zwei Argumente: Die Callback-Funktion und den Initialwert des accumulators, hier acc. Die Callbackmethode hat vier Argumente, die wir nutzen können:
  • acc: Der Accumulator, welcher den gesamten Wert speichert
  • cur: Das aktuelle Element
  • index: Den Index des aktuellen Elements
  • arr: Der gesamte Array
const max = movements.reduce(
  (acc, cur) => (acc > cur ? acc : cur),
  movements[0]
);