JavaScript Regex Sets und Ranges

Reguläre Ausdrücke (regex) in JavaScript sind ein mächtiges Werkzeug zur Textverarbeitung und -manipulation. Ein Zeichensatz (oder Zeichenklasse) ermöglicht es, an einer bestimmten Position im string zu sagen: „Erkenne genau eines dieser Zeichen" — ein Grundbaustein, auf den man bei der Eingabevalidierung, dem Parsen von Text oder der Datenbereinigung ständig zurückgreift.

Dieser Leitfaden behandelt Sets [...], Ranges wie [a-z0-9], Negation [^...], das Escaping von Sonderzeichen innerhalb eines Sets sowie die Kombination von Sets mit Kurzschreibweisen wie \w und \d. Jedes Beispiel ist ausführbar, sodass Sie die Ausgabe selbst überprüfen können.

Einführung in Sets in Regex

Ein Set in einem regulären Ausdruck gibt eine Gruppe von Zeichen an, von denen jedes einzelne an einer bestimmten Position im Suchstring übereinstimmen kann. Sets werden in eckigen Klammern [] geschrieben. Entscheidend ist: Ein Set trifft immer genau ein Zeichen — [abc] trifft ein einzelnes a, b oder c, nicht den string "abc".

Einfache Sets

Beispielsweise trifft das Set [abc] jedes einzelne Zeichen, das a, b oder c ist. Mit dem globalen Flag g gibt match() jedes gefundene Zeichen zurück:

Negierte Sets

Um ein negiertes Set zu erstellen, das jedes Zeichen trifft, das nicht aufgeführt ist, setzt man direkt nach der öffnenden eckigen Klammer ein Caret-Zeichen ^. Zum Beispiel trifft [^abc] jedes einzelne Zeichen außer a, b oder c. Das ^ hat diese besondere Bedeutung nur in der ersten Position; an jeder anderen Stelle steht es für ein wörtliches Caret-Zeichen.

Ranges verstehen

Innerhalb eines Sets kann man statt der Auflistung jedes einzelnen Zeichens eine Range mit einem Bindestrich angeben — start-end. Eine Range trifft jedes Zeichen, dessen Codepoint zwischen den beiden Endpunkten liegt (einschließlich dieser). Das hält Muster kurz und lesbar.

Numerische Ranges

Zum Beispiel steht [0-9] für jede Ziffer von 0 bis 9. Mit + trifft es eine oder mehrere aufeinander folgende Ziffern, sodass aufeinander folgende Ziffern zu einem einzigen Treffer zusammengefasst werden:

Alphabetische Ranges

Entsprechend trifft [a-z] jeden Kleinbuchstaben und [A-Z] jeden Großbuchstaben. Sie können mehrere Ranges in einem Set kombinieren — [A-Za-z0-9] deckt Buchstaben und Ziffern ab — um gleichzeitig mehrere Arten von Zeichen zu treffen:

Ein typischer Praxisfall ist eine einfache Bezeichner-Prüfung, bei der das erste Zeichen ein Buchstabe sein muss und die restlichen Buchstaben, Ziffern oder Unterstriche sein dürfen:

Erweiterte Verwendung von Sets und Ranges

Kurzschreibweisen für Klassen lassen sich direkt neben Literalzeichen und Ranges in ein Set einfügen. Die Kurzschreibweisen verhalten sich innerhalb von [...] genauso wie außerhalb:

• \d — eine Ziffer, äquivalent zu [0-9]
• \w — ein „Wort"-Zeichen: [A-Za-z0-9_]
• \s — Leerzeichen (Leerzeichen, Tabulator, Zeilenumbruch, …)

So bedeutet [\d.] „eine Ziffer oder ein Punkt" und [\w-] „ein Wortzeichen oder ein Bindestrich". Unter Character classes finden Sie die vollständige Liste und die negierten Großbuchstaben-Formen (\D, \W, \S).

Beispiel: Wortzeichen und Sonderzeichen kombinieren

Hier ein praktisches Beispiel: Wortzeichen und ein bestimmtes Satzzeichen beibehalten, während alles andere ignoriert wird.

Hier deckt \w alle Buchstaben, Ziffern und den Unterstrich ab. Durch das Hinzufügen von ! zum Set wird auch das Ausrufezeichen erkannt, das \w nicht enthält. Das ist praktisch, wenn Sie einige bestimmte Sonderzeichen zulassen möchten, ohne die Übereinstimmung auf alle Satzzeichen auszuweiten.

Unicode und mehrsprachige Unterstützung

Ranges wie [a-z] decken nur ASCII-Buchstaben ab — akzentuierte und nicht-lateinische Zeichen werden nicht erfasst. Um Buchstaben in allen Sprachen zu treffen, verwenden Sie Unicode-Eigenschafts-Escapes (ECMAScript 2018+) zusammen mit dem u-Flag. Beispielsweise trifft \p{L} jeden Buchstaben aus jedem Schriftsystem:

Das u-Flag ist erforderlich, damit \p{...} funktioniert. Mehr erfahren Sie unter The unicode flag "u" and class \p{...} und in der Übersicht zu Patterns and flags.

Ranges in regulären Ausdrücken ausschließen

Negation funktioniert auch mit Ranges. [^0-9] trifft jede Nicht-Ziffer, und nach dem Caret können Ranges und einzelne Zeichen gemischt werden. Eine häufige Aufgabe ist das Herausfiltern oder Finden aller Zeichen, die nicht zu einer erlaubten Gruppe gehören — hier jedes Zeichen, das kein Vokal ist (das i-Flag macht es schreibungsunabhängig):

Beispiel für das Ausschließen von Ranges

Dieser reguläre Ausdruck findet alle Nicht-Vokal-Zeichen, einschließlich Satzzeichen und Leerzeichen. Das ist eine leistungsstarke Methode, um unerwünschte Zeichen aus einem string herauszufiltern.

Sonderzeichen in Sets escapen

Innerhalb eines Sets sind weit weniger Zeichen speziell als außerhalb. Sie müssen sich nur um vier Zeichen sorgen: die schließende eckige Klammer ], den Backslash \, das Caret ^ (nur am Anfang speziell) und den Bindestrich - (nur zwischen zwei Zeichen speziell). Escapen Sie diese mit einem Backslash, um sie wörtlich zu verwenden.

Eine nützliche Abkürzung: Ein Bindestrich wird als Literal behandelt, wenn er das erste oder letzte Zeichen im Set ist; [-+] und [a-z-] benötigen daher kein Escaping. Ebenso verlieren Zeichen, die außerhalb eines Sets speziell sind — wie ., *, +, (, ) — innerhalb eines Sets ihre besondere Bedeutung und werden wörtlich erkannt; [.+] trifft also einfach einen Punkt oder ein Pluszeichen.

Beispiel für das Escaping von Sonderzeichen

Hier werden die eckigen Klammern escaped, damit sie als wörtliche Zeichen gelesen werden, anstatt ein Set zu öffnen oder zu schließen. Das nächste Beispiel zeigt die Bindestrich-als-Literal-Regel und die Regel, dass der Punkt seine besondere Bedeutung verliert, gemeinsam:

Fazit

Die Beherrschung von Sets und Ranges in JavaScript-Regex verbessert nicht nur Ihre Möglichkeiten zur Stringmanipulation, sondern führt auch zu saubererem und effizienterem Code. Sie sind besonders nützlich beim Parsen von Text, der Eingabevalidierung und der Datenverarbeitung in der Webentwicklung.

Übungen