Quiz: Reguläre Ausdrücke – Meisterkurs

Dieses Muster verwendet g, aber nicht i:

• g findet alle Treffer
• Ohne i ist die Suche case‑sensitive

Ohne das i‑Flag wird nur das kleingeschriebene „cat“ gefunden.

Das ist besonders nützlich bei Benutzereingaben oder HTML, wo die Groß‑Kleinschreibung variieren kann.

Mehr über RegExp‑Flags erfahren

Das Muster /^[ch]at/ findet Zeichenketten, die:

• Am Anfang (^) entweder ein ‘c’ oder ein ‘h’ haben (das bedeutet [ch] – eine Zeichenklasse, die ein einzelnes Zeichen matcht)
• Gefolgt von exakt ‘at’

Deshalb passen nur “cat” und “hat” zu diesem Muster. Die filter()‑Methode behält nur die passenden Elemente.

Mehr zu Zeichenklassen auf MDN

Das Muster /<div>.*?<\/div>/g verwendet nicht-gieriges Matching mit *?, das bedeutet:

• <div> matchen
• Beliebiges Zeichen (.*) matchen, aber so wenig wie möglich (?)
• Bis </div> gefunden ist
• Das g‑Flag sorgt dafür, dass alle Vorkommen gematcht werden

Ohne das ? würde das gierige .* alles vom ersten <div> bis zum letzten </div> erfassen und einen einzigen großen Treffer ergeben. Mit ? wird jedes Paar separat gematcht.

Erfahren Sie mehr über gieriges vs lazy Matching

Das Muster \w+ entspricht einem oder mehreren Wortzeichen. Obwohl im String ein Zeilenumbruch vorkommt, matcht \w:

• Buchstaben (a‑z, A‑Z)
• Zahlen (0‑9)
• Unterstrich (_)

Der Zeilenumbruch wirkt also als Wortgrenze, und wir erhalten zwei Treffer. Hätten wir .* verwendet, würde es standardmäßig den Zeilenumbruch nicht matchen (dafür bräuchte man das s‑Flag).

Erfahren Sie mehr über Metazeichen

Dieses Muster liefert keinen Treffer, weil das Look-ahead rückwärts gerichtet ist! Wenn du Ziffern möchtest, die von $ oder € vorausgehen, verwende ein Look-behind: /(?<=[\$€])\d+/g.

Look-aheads prüfen, was nach der aktuellen Position kommt. Das hier geschriebene Muster sucht nach:

• Einer oder mehreren Ziffern (\d+)
• Gefolgt von ((?=...)) entweder $ oder € ([\$€])

Da es keine Zahlen gibt, die von Währungssymbolen gefolgt werden (sie stehen davor), gibt es keine Treffer.

Erfahre mehr über Look-ahead Assertions

Das \b steht für einen Wortgrenzen‑Marker, der folgendes matcht:

• Zwischen einem Wortzeichen und einem Nicht‑Wortzeichen
• Am Anfang/Ende des Strings, wenn dort ein Wortzeichen steht

Also matcht /\bcat\b/ das Wort “cat” nur, wenn es ein vollständiges Wort ist und nicht Teil eines anderen Wortes.

• ✅ “cat” (von Leerzeichen umgeben)
• ❌ “cats” (keine Grenze nach “cat”)
• ❌ “category” (keine Grenze nach “cat”)

Mehr über Wortgrenzen erfahren

Das g‑Flag (global) ändert das Verhalten von match():

• Ohne g: Gibt die erste Übereinstimmung mit Capture‑Gruppen zurück
• Mit g: Gibt ein Array aller passenden Zeichenketten zurück

In diesem Fall findet es alle Vorkommen von “a” in “banana”.

Hinweis: Wenn du sowohl alle Treffer ALS auch Capture‑Gruppen brauchst, verwende matchAll() oder die exec()‑Methode in einer Schleife.

Erfahre mehr über das globale Flag

Der negative Look-behind (?<!abc) stellt sicher, dass den Ziffern nicht “abc” vorausgeht:

• ❌ “123” (vorgestellt von “abc”)
• ✅ “23” (vorgestellt von “abc1”)
• ✅ “456” (vorgestellt von “def”)

JavaScript unterstützt Look-behind‑Assertions in modernen Engines. Dieses Beispiel verwendet ein Look-behind fester Länge: abc ist immer drei Zeichen. Look-behind variabler Länge ist die kniffligere, engine‑spezifische Ecke.

Hinweis: Look-behind‑Unterstützung ist in JavaScript relativ neu. Prüfe die Browser‑Kompatibilität, falls du ältere Browser unterstützen musst.

Das Muster verwendet drei Erfassungsgruppen:

1. (\d{4}) erfasst das Jahr
2. (\d{2}) erfasst den Monat
3. (\d{2}) erfasst den Tag

match() ohne das g‑Flag gibt zurück:

• Index 0: Gesamte Übereinstimmung
• Index 1+: Erfassungsgruppen

slice(1) ist ein gängiger Trick, um nur die Erfassungsgruppen zu erhalten.

Erfahren Sie mehr über Gruppen und Erfassung

Das negative Look-ahead (?![a-z]) stellt sicher, dass nach den Ziffern keine Kleinbuchstaben folgen. Da der Teil „3aBc“ einen Kleinbuchstaben nach den Ziffern enthält, wird er nicht gematcht. Deshalb wird nur der Anfang „12“ gematcht.

Mehr erfahren über negatives Look-ahead

Das Muster /(?<=,)/ ist ein Look-behind, das nach einem Komma matcht:

• a, (nach Komma)
• b, (nach Komma)
• c (kein Komma danach)

Das Look-behind verbraucht das Komma nicht, daher bleibt das Komma am vorherigen Segment im Split‑Ergebnis angehängt.

Das ist praktisch, wenn du einen String basierend auf dem, was ihm vorausgeht, aufteilen willst ohne das Trennzeichen zu verlieren.

Erfahre mehr über Look-behind Assertions

Sonderzeichen müssen mit \\ escaped werden, um sie wörtlich zu matchen:

• $ ist ein Sonderzeichen (Ende des Strings)
• Um ein wörtliches Dollarzeichen zu matchen, escapen Sie es: \\$

Häufige Zeichen, die escaped werden müssen:

. * + ? ^ $ [ ] \ ( ) { } |

Ohne Escaping haben viele Sonderzeichen Regex‑Bedeutungen, die möglicherweise nicht das gewünschte Verhalten erzeugen.

Erfahren Sie mehr über das Escapen von Sonderzeichen

Der positive Look-behind (?<=\$) stellt sicher, dass die Ziffern von einem Dollarzeichen vorausgegangen werden:

• (?<=\$): Look-behind für Dollarzeichen
• \d+: Ein oder mehrere Ziffern matchen

Look-behind‑Assertions verbrauchen keine Zeichen; sie prüfen nur, was davor steht. Das ist nützlich, wenn man etwas basierend auf dem Vorgänger matchen möchte, ohne den vorherigen Teil einzuschließen.

Erfahren Sie mehr über Look-behind‑Assertions

Das Muster verwendet lazy Matching mit *?:

• <b>: Öffnendes Tag matchen
• (.*?): Beliebige Zeichen erfassen (lazy)
• </b>: Schließendes Tag matchen

Das ? nach * macht das Matching lazy und sorgt dafür, dass so wenige Zeichen wie möglich erfasst werden. Ohne ? wäre es greedy und würde so viel wie möglich erfassen.

slice(1) gibt nur die erfasste Gruppe zurück.

Mehr erfahren über greedy vs lazy matching

Der u‑Flag aktiviert:

• Unicode‑Property‑Escapes (\\p{...})
• Korrekte Behandlung von Surrogat‑Paaren

Ohne u könnten Emoji‑ und andere Unicode‑Zeichen nicht korrekt gematcht werden. Das Muster \\p{Emoji} matcht Zeichen mit der Unicode‑Property Emoji. In diesem String bedeutet das die beiden Emoji‑Piktogramme.

Hinweis: Unicode‑Property‑Escapes benötigen den u‑Flag.

Mehr erfahren über den Unicode‑Modus

Schreiben Sie so etwas niemals in die Produktion! 😅

Dieses Muster verwendet mehrere positive Look‑aheads, um durchzusetzen:

• Mindestens einen Großbuchstaben: (?=.*[A-Z])
• Mindestens einen Kleinbuchstaben: (?=.*[a-z])
• Mindestens eine Ziffer: (?=.*\d)
• Mindestens ein Sonderzeichen: (?=.*[!@#$%^&*])
• Mindestlänge von 8: .{8,}

Look‑aheads sind ideal für Passwortvalidierung, weil sie mehrere Kriterien prüfen können, ohne Zeichen zu verbrauchen.

Erfahren Sie mehr über Passwortvalidierungsmuster