Reguläre Ausdrücke in TypeScript: vollständiger Leitfaden mit Beispielen

Einführung in reguläre Ausdrücke in TypeScript

Reguläre Ausdrücke (regex) sind ein leistungsstarkes Werkzeug zum Suchen, Ersetzen und Validieren von Zeichenketten. In TypeScript werden sie, wie in JavaScript, über das eingebaute Objekt RegExp implementiert. TypeScript fügt jedoch eine strenge Typisierung hinzu, was die Arbeit mit regulären Ausdrücken sicherer und vorhersagbarer macht. In diesem Artikel werden wir die Syntax, Methoden, Typisierung und praktische Beispiele für die Verwendung regulärer Ausdrücke in TypeScript behandeln.

Was ist ein regulärer Ausdruck?

Ein regulärer Ausdruck ist eine Zeichenfolge, die ein Suchmuster definiert. In TypeScript werden reguläre Ausdrücke auf zwei Arten erstellt:

• Literale Syntax: const regex: RegExp = /\\d+/g;
• RegExp-Konstruktor: const regex: RegExp = new RegExp('\\\\d+', 'g');

Die zweite Methode ist nützlich, wenn das Muster dynamisch aus Variablen erstellt wird.

Grundlegende Methoden für die Arbeit mit regulären Ausdrücken in TypeScript

1. Methode test() — Prüfung auf Übereinstimmung

Die Methode test() gibt einen boolean zurück — ob eine Übereinstimmung in der Zeichenkette vorhanden ist.

const emailRegex: RegExp = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/;const email: string = 'user@example.com';

if (emailRegex.test(email)) {  console.log('Email ist korrekt');} else {  console.log('Email ist nicht korrekt');}// Ausgabe: Email ist korrekt

2. Methode exec() — Details der Übereinstimmung abrufen

Die Methode exec() gibt ein Objekt RegExpExecArray | null zurück. Es enthält die Übereinstimmung, Erfassungsgruppen und die Position in der Zeichenkette.

const dateRegex: RegExp = /(\\d{2})\\.(\\d{2})\\.(\\d{4})/;const dateString: string = 'Datum: 15.03.2023';const match: RegExpExecArray | null = dateRegex.exec(dateString);

if (match) {  console.log(`Tag: ${match[1]}, Monat: ${match[2]}, Jahr: ${match[3]}`);  // Ausgabe: Tag: 15, Monat: 03, Jahr: 2023}

3. Methode match() — Suche nach allen Übereinstimmungen in einer Zeichenkette

Die String-Methode match() akzeptiert einen regulären Ausdruck und gibt ein Array von Übereinstimmungen oder null zurück.

const text: string = 'Katzen und Kätzchen sind die besten!';const catRegex: RegExp = /katzen?/gi;const matches: RegExpMatchArray | null = text.match(catRegex);

if (matches) {  console.log(matches); // ['Katzen', 'Kätzchen']}

4. Methode replace() — Ersetzung nach Muster

Die Methode replace() ersetzt Übereinstimmungen durch eine angegebene Zeichenkette oder das Ergebnis einer Funktion.

const phone: string = '+7 (123) 456-78-90';const cleanPhone: string = phone.replace(/[\\s\\-\\(\\)\\+]/g, '');console.log(cleanPhone); // 71234567890

// Ersetzung mit Erfassungsgruppenconst name: string = 'Ivanov Ivan';const reversed: string = name.replace(/(\\w+)\\s(\\w+)/, '$2 $1');console.log(reversed); // Ivan Ivanov

5. Methode split() — Aufteilen einer Zeichenkette

Ein regulärer Ausdruck kann verwendet werden, um eine Zeichenkette in Teile zu zerlegen.

const data: string = 'Apfel;Birne,Orange:Bananen';const fruits: string[] = data.split(/[;,.:]/);console.log(fruits); // ['Apfel', 'Birne', 'Orange', 'Bananen']

Typisierung regulärer Ausdrücke in TypeScript

TypeScript bestimmt automatisch den Typ einer Variablen als RegExp bei Verwendung der literalen Syntax. In komplexen Projekten kann jedoch eine explizite Typannotation erforderlich sein:

// Explizite Typangabeconst hexColor: RegExp = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/;

// Typisierung für eine Funktion, die RegExp zurückgibtfunction createUrlRegex(baseUrl: string): RegExp {  return new RegExp(`^${baseUrl}/[a-z]+$`, 'i');}

const myRegex: RegExp = createUrlRegex('https://example.com');console.log(myRegex.test('ht