0Pricing
JavaScript Academy · Lektion

Gruppen, Captures und Replace

Textteile mit Gruppen erfassen, benannte Gruppen verwenden, alle Treffer durchlaufen und sicher mit Backreferences oder einer Funktion ersetzen

Gruppen, Captures und Replace ist eine kostenlose JavaScript Academy-Lektion auf CoddyKit. Dies ist Lektion 2 von 3. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des JavaScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der JavaScript Academy-Kurs umfasst insgesamt 3 Lektionen.

Wozu Gruppen?

Ziel: Extrahieren und strukturieren Sie Text neu.

  • Erfassungsgruppen: (...)
  • Benannte Gruppen: (?<name>...)
  • matchAll, um alle Ergebnisse zu durchlaufen
  • replace mit $1 oder einer Funktion
Gruppen, Captures und Replace — Illustration 1

Nummerierte Gruppen

Verwenden Sie (...), um Teile zu erfassen. Greifen Sie über den Index darauf zu: m[1], m[2], ...

// Capture YYYY-MM-DD into groups
const r = /(\\d{4})-(\\d{2})-(\\d{2})/;
const m = r.exec("Today: 2025-09-26");
if (m) {
  console.log("year:", m[1], "month:", m[2], "day:", m[3]);
} else {
  console.log("no match");
}
Gruppen, Captures und Replace — Illustration 2

Benannte Gruppen

Benannte Gruppen fügen über m.groups.name gut lesbare Schlüssel hinzu.

// Named groups make code clearer
const rx = /(?<y>\\d{4})-(?<m>\\d{2})-(?<d>\\d{2})/;
const hit = rx.exec("Release 2024-01-05");
if (hit) {
  console.log("y:", hit.groups.y, "m:", hit.groups.m, "d:", hit.groups.d);
}
Gruppen, Captures und Replace — Illustration 3

Treffer durchlaufen

matchAll gibt einen Iterator zurück; verwenden Sie ihn zusammen mit g, um jeden Treffer zu durchlaufen und Gruppen auszulesen.

// matchAll with the g flag to get every match and groups
const text = "IDs: A-12, B-7, C-300";
const pattern = /([A-Z])-(\\d+)/g;

for (const match of text.matchAll(pattern)) {
  console.log("letter:", match[1], "num:", match[2]);
}
Gruppen, Captures und Replace — Illustration 4

Mit Gruppen ersetzen

replace kann $1, $2 oder einen callback verwenden, um den neuen Text zu erstellen.

// Replace order: "2025-09-26" -> "26/09/2025"
const date = "2025-09-26";

// With backreferences
const swapped1 = date.replace(/(\\d{4})-(\\d{2})-(\\d{2})/, "$3/$2/$1");
console.log("swap1:", swapped1);

// With a function for more control
const swapped2 = date.replace(/(?<y>\\d{4})-(?<m>\\d{2})-(?<d>\\d{2})/, function (_all, _y, _m, _d, groups) {
  return groups.d + "/" + groups.m + "/" + groups.y;
});
console.log("swap2:", swapped2);
Gruppen, Captures und Replace — Illustration 5

Tipps und Fallstricke

Tipps:

  • Fügen Sie g hinzu, wenn Sie alle Treffer benötigen (verwenden Sie matchAll).
  • Bevorzugen Sie aus Gründen der Übersichtlichkeit benannte Gruppen.
  • Halten Sie Muster klein und testen Sie sie mit kurzen Beispielzeichenketten.
Gruppen, Captures und Replace — Illustration 6

Quiz zu den matchAll-Grundlagen

Kurztest: Durchlaufen Sie alle Treffer mit Gruppen.

Gruppen, Captures und Replace — Illustration 7

Zusammenfassung

Zusammenfassung: Erfassen Sie mit (...), verwenden Sie aus Gründen der Übersichtlichkeit benannte Gruppen, durchlaufen Sie alle Treffer mit matchAll und strukturieren Sie Text mit replace sowie Rückverweisen oder einem callback neu.

Gruppen, Captures und Replace — Illustration 8

Häufig gestellte Fragen

Ist die Lektion „Gruppen, Captures und Replace“ kostenlos?

Ja — der vollständige Text von „Gruppen, Captures und Replace“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des JavaScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der JavaScript Academy-Kurs umfasst insgesamt 3 Lektionen.

Was lerne ich in „Gruppen, Captures und Replace“?

Textteile mit Gruppen erfassen, benannte Gruppen verwenden, alle Treffer durchlaufen und sicher mit Backreferences oder einer Funktion ersetzen Du übst JavaScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um JavaScript Academy zu starten?

Keine Vorkenntnisse erforderlich. JavaScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 2 von 3.

Wie lange dauert die Lektion „Gruppen, Captures und Replace“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser JavaScript Academy-Lektion Code schreiben und ausführen?

Ja. Jede JavaScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

  1. Regex-Grundlagen – Literale, test, Anker und Flags
  2. Gruppen, Captures und Replace
  3. Validierung und kleine Fallstricke
← Zurück zu JavaScript Academy