JavaScript Array-Methoden: Der komplette Guide 2025

Moderne JavaScript-Entwicklung ohne Array-Methoden? Undenkbar! Lerne die wichtigsten funktionalen Array-Methoden kennen: von map() und filter() bis zu reduce() und forEach(). Mit praktischen Beispielen, Syntax-Highlighting und Performance-Tipps.

1. map() – Daten transformieren

Die map() Methode erstellt ein neues Array, indem sie eine Funktion auf jedes Element des ursprünglichen Arrays anwendet.

const numbers = [1, 2, 3, 4, 5]

// Alle Zahlen verdoppeln
const doubled = numbers.map(n => n * 2)
console.log(doubled) // [2, 4, 6, 8, 10]

// Preise mit 19% MwSt.
const netPrices = [10, 20, 30]
const grossPrices = netPrices.map(price => price * 1.19)
console.log(grossPrices) // [11.9, 23.8, 35.7]

2. filter() – Elemente filtern

Die filter() Methode erstellt ein neues Array mit allen Elementen, die einen Test bestehen.

const numbers = [1, 2, 3, 4, 5, 6]

// Nur gerade Zahlen
const evenNumbers = numbers.filter(n => n % 2 === 0)
console.log(evenNumbers) // [2, 4, 6]

// Aktive Nutzer filtern
const users = [{active: true}, {active: false}]
const activeUsers = users.filter(u => u.active)

3. reduce() – Werte aggregieren

Die reduce() Methode reduziert ein Array auf einen einzigen Wert durch eine Akkumulator-Funktion.

const numbers = [1, 2, 3, 4, 5]

// Summe berechnen
const sum = numbers.reduce((acc, current) => acc + current, 0)
console.log(sum) // 15

// Durchschnitt berechnen
const average = numbers.reduce((acc, current) => acc + current, 0) / numbers.length

4. find(), some(), every() – Suchen und Prüfen

🔍 find() & findIndex()

const users = [
  { id: 1, name: 'Max' },
  { id: 2, name: 'Anna' }
]

const user = users.find(u => u.id === 2)

✅ some() & every()

const ages = [16, 25, 30]

// Mindestens ein Erwachsener?
const hasAdult = ages.some(age => age >= 18)

5. Performance-Tipps

⚡ Wichtige Performance-Regeln

  • find() stoppt bei erstem Treffer – effizienter als filter()[0]
  • • Vermeide unnötige Zwischenarrays bei Method Chaining
  • forEach() ist schneller als map() wenn kein Rückgabewert benötigt wird
// ❌ Ineffizient: Mehrere Durchläufe
const result1 = data
  .filter(item => item.active)
  .filter(item => item.price > 100)

// ✅ Effizienter: Kombinierte Bedingungen
const result2 = data
  .filter(item => item.active && item.price > 100)