Expressions régulières en TypeScript : guide complet avec exemples

Introduction aux expressions régulières en TypeScript

Les expressions régulières (regex) sont un outil puissant pour rechercher, remplacer et valider des chaînes de caractères. En TypeScript, comme en JavaScript, elles sont implémentées via l'objet intégré RegExp. Cependant, TypeScript ajoute un typage strict, ce qui rend le travail avec les expressions régulières plus sûr et plus prévisible. Dans cet article, nous allons détailler la syntaxe, les méthodes, le typage et des exemples pratiques d'utilisation des expressions régulières en TypeScript.

Qu'est-ce qu'une expression régulière ?

Une expression régulière est une séquence de caractères définissant un modèle de recherche. En TypeScript, les expressions régulières sont créées de deux manières :

• Syntaxe littérale : const regex: RegExp = /\\d+/g;
• Constructeur RegExp : const regex: RegExp = new RegExp('\\\\d+', 'g');

La deuxième méthode est utile lorsque le modèle est généré dynamiquement à partir de variables.

Méthodes principales pour travailler avec les expressions régulières en TypeScript

1. Méthode test() — Vérification de la présence d'une correspondance

La méthode test() retourne un boolean — indiquant s'il y a une correspondance dans la chaîne.

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 valide');} else {  console.log('Email invalide');}// Sortie : Email valide

2. Méthode exec() — Obtention des détails de la correspondance

La méthode exec() retourne un objet RegExpExecArray | null. Il contient la correspondance, les groupes de capture et la position dans la chaîne.

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

if (match) {  console.log(`Jour : ${match[1]}, Mois : ${match[2]}, Année : ${match[3]}`);  // Sortie : Jour : 15, Mois : 03, Année : 2023}

3. Méthode match() — Recherche de toutes les correspondances dans une chaîne

La méthode de chaîne match() prend une expression régulière et retourne un tableau de correspondances ou null.

const text: string = 'Les chats et les chattes sont les meilleurs !';const catRegex: RegExp = /cha[ts]s?/gi;const matches: RegExpMatchArray | null = text.match(catRegex);

if (matches) {  console.log(matches); // ['chats', 'chattes']}

4. Méthode replace() — Remplacement selon un modèle

La méthode replace() remplace les correspondances par la chaîne spécifiée ou le résultat d'une fonction.

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

// Remplacement avec utilisation de groupes de captureconst name: string = 'Ivanov Ivan';const reversed: string = name.replace(/(\\w+)\\s(\\w+)/, '$2 $1');console.log(reversed); // Ivan Ivanov

5. Méthode split() — Division d'une chaîne

Une expression régulière peut être utilisée pour diviser une chaîne en parties.

const data: string = 'pomme;poire,orange:banane';const fruits: string[] = data.split(/[;,.:]/);console.log(fruits); // ['pomme', 'poire', 'orange', 'banane']

Typage des expressions régulières en TypeScript

TypeScript détermine automatiquement le type de la variable comme RegExp lors de l'utilisation de la syntaxe littérale. Cependant, dans les projets complexes, une annotation de type explicite peut être nécessaire :

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

// Typage pour une fonction retournant un RegExpfunction createUrlRegex(baseUrl: string): RegExp {  return new RegExp(`^${baseUrl}/[a-z]+$`, 'i');}

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