Reguläre Ausdrücke in TypeScript mit Beispielen: in der Praxis

Reguläre Ausdrücke in TypeScript: von der Theorie zur Praxis

Reguläre Ausdrücke (regex) sind ein leistungsstarkes Werkzeug für die Arbeit mit Zeichenketten. In TypeScript ermöglichen sie nicht nur Suchen, Ersetzen und Validieren, sondern bieten auch eine strenge Typisierung, was die Anzahl der Fehler zur Kompilierzeit reduziert. In diesem Artikel werden wir anhand realer Beispiele untersuchen, wie man reguläre Ausdrücke in TypeScript verwendet: von der E-Mail-Validierung bis zur sicheren Datenextraktion.

1. Erstellung und Typisierung regulärer Ausdrücke

In TypeScript kann ein regulärer Ausdruck auf zwei Arten erstellt werden: mit einem Literal oder dem RegExp-Konstruktor. Die erste Methode ist vorzuziehen, da sie kürzer ist und kein Escapen von Backslashes erfordert.

// Literal (empfohlene Methode)const emailRegex: RegExp = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/;

// Konstruktor (nützlich für dynamische Muster)const pattern: string = 'hallo';const dynamicRegex: RegExp = new RegExp(pattern, 'gi');

console.log(emailRegex.test('benutzer@beispiel.com')); // trueconsole.log(dynamicRegex.test('Hallo, Welt!')); // true (Flag i ignoriert Groß-/Kleinschreibung)

Beachten Sie die Typannotation : RegExp. TypeScript leitet den Typ für Literale automatisch ab, aber die explizite Angabe hilft, den Code zu dokumentieren.

2. Flags und ihre Typisierung

Flags ändern das Verhalten eines regulären Ausdrucks. In TypeScript kann der Typ der Flags durch ein String-Literal oder eine Aufzählung festgelegt werden. Betrachten wir die wichtigsten Flags:

• g — globale Suche (stoppt nicht nach dem ersten Treffer);
• i — Groß-/Kleinschreibung ignorieren;
• m — mehrzeiliger Modus (^ und $ gelten für jede Zeile);
• s — Punkt stimmt mit Zeilenumbruchzeichen überein;
• u — Unicode-Unterstützung;
• y — Suche ab der letzten gefundenen Position (sticky).

// Typisierung von Flags als Stringconst regexWithFlags: RegExp = /test/gim;

// Überprüfung der Flagsconsole.log(regexWithFlags.flags); // "gim"console.log(regexWithFlags.global); // trueconsole.log(regexWithFlags.ignoreCase); // trueconsole.log(regexWithFlags.multiline); // true

Verwenden Sie für dynamische Flags den Typ string, aber beschränken Sie ihn besser auf gültige Werte mit einer Literal-Union:

type RegexFlags = 'g' | 'i' | 'm' | 's' | 'u' | 'y';const flags: RegexFlags = 'gi'; // Fehler: 'gi' ist kein einzelnes Flag// Richtig: String übergebenconst dynamicFlags: string = 'gi';const regex: RegExp = new RegExp('muster', dynamicFlags);

3. RegExp-Methoden und Typisierung der Ergebnisse

Die wichtigsten Methoden für die Arbeit mit regulären Ausdrücken in TypeScript:

• test() — gibt boolean zurück;
• exec() — gibt RegExpExecArray | null zurück;
• match() — Methode von Strings, gibt RegExpMatchArray | null zurück;
• replace() — ersetzt Treffer und gibt einen String zurück;
• search() — gibt den Index des ersten Treffers oder -1 zurück.

Betrachten wir ein Beispiel mit exec(), das Zugriff auf Erfassungsgruppen bietet:

const dateRegex: RegExp = /(\\d{4})-(\\d{2})-(\\d{2})/;const dateStr: string = 'Heute ist 2025-03-15';

const match: RegExpExecArray | null = dateRegex.exec(dateStr);

if (match) {  const [fullMatch, year, month, day] = match;  console.log(`Jahr: ${year}, Monat: ${month}, Tag: ${day}`);  // Ausgabe: Jahr: 2025, Monat: 03, Tag: 15} else {  console.log('Datum nicht gefunden');}

Beachten Sie: match[0] ist der vollständige Treffer, und die Indizes 1, 2, 3 sind die Erfassungsgruppen. TypeScript leitet die Typen korrekt ab, wenn Sie Destrukturierung verwenden.