Guide du débutant – SitePoint

Online Coding Courses for Kids

Dans ce guide, vous apprendrez l’expression rationnelle ou la syntaxe des expressions régulières. À la fin, vous serez en mesure d’appliquer des solutions d’expression régulière dans la plupart des scénarios qui l’exigent dans votre travail de développement Web.

Les expressions régulières ont de nombreux cas d’utilisation, notamment:

  • validation d’entrée de formulaire
  • grattage web
  • rechercher et remplacer
  • filtrage des informations dans des fichiers texte massifs tels que les journaux

Expressions régulières, ou regex comme on les appelle communément, ils semblent compliqués et intimidants pour les nouveaux utilisateurs. Jetez un œil à cet exemple:

/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$/

Cela ressemble à du texte tronqué. Mais ne désespérez pas, il y a une méthode derrière cette folie.

xkcd.com/208

Crédit: xkcd

Je vais vous montrer comment maîtriser les expressions régulières en un rien de temps. Tout d’abord, clarifions la terminologie utilisée dans ce guide:

  • modèle: modèle d’expression régulière
  • chaîne: chaîne de test utilisée pour faire correspondre le motif
  • chiffre: 0-9
  • lettre: a-z, A-Z
  • symbole:! $% ^ & * () _ + | ~ – = `{}[]: ”; ‘<>?,. /
  • espace: espace blanc unique, tabulation
  • personnage: fait référence à une lettre, un chiffre ou un symbole

Les bases

Pour apprendre rapidement l’expression régulière avec ce guide, visitez Regex101, où vous pouvez créer des modèles d’expression régulière et les tester par rapport aux chaînes (texte) que vous fournissez.

Lorsque vous ouvrez le site, vous devez sélectionner le Javascript saveur, car c’est ce que nous allons utiliser pour ce guide. (La syntaxe des expressions rationnelles est généralement la même pour toutes les langues, mais il existe quelques différences mineures.)

Ensuite, vous devez désactiver le global et multi line drapeaux en Regex101. Nous les couvrirons dans la section suivante. Pour l’instant, nous allons examiner la forme d’expression régulière la plus simple que nous puissions créer. Saisissez les informations suivantes:

  • champ de saisie regex: chat
  • chaîne de test: chauve-souris rat chat assis gros chats mangent tat tapis de chat CAT

regex de base

Notez que les expressions régulières en JavaScript commencent et finissent par /. Si vous deviez écrire une expression régulière dans du code JavaScript, cela ressemblerait à ceci: /cat/ sans guillemets. Dans l’état ci-dessus, l’expression régulière correspond à la chaîne «cat». Cependant, comme vous pouvez le voir dans l’image ci-dessus, il existe plusieurs chaînes de “chat” qui ne sont pas appariées. Dans la section suivante, nous verrons pourquoi.

Indicateurs de regex globaux et insensibles à la casse

Par défaut, un modèle d’expression régulière ne renvoie que la première correspondance qu’il trouve. Si vous souhaitez renvoyer des correspondances supplémentaires, vous devez activer global drapeau, noté g. Les motifs d’expression régulière sont également sensibles à la casse par défaut. Vous pouvez remplacer ce comportement en activant le insensible drapeau, désigné par i. Le modèle d’expression régulière mis à jour est maintenant entièrement exprimé sous la forme /cat/gi. Comme vous pouvez le voir ci-dessous, toutes les chaînes «chat» ont été appariées, y compris celle avec un étui différent.

drapeau global insensible

Jeux de caractères

Dans l’exemple précédent, nous avons appris à effectuer des correspondances exactes respectant la casse. Et si nous voulions faire correspondre «chauve-souris», «chat» et «graisse». Nous pouvons le faire en utilisant jeux de caractères, noté avec []. Fondamentalement, vous mettez plusieurs caractères que vous souhaitez faire correspondre. Par exemple, [bcf]at correspondra à plusieurs chaînes comme suit:

jeux de caractères

Les jeux de caractères fonctionnent également avec des chiffres.

Gammes

Supposons que nous voulons faire correspondre tous les mots qui se terminent par at. Nous pourrions fournir l’alphabet complet à l’intérieur du jeu de caractères, mais ce serait fastidieux. La solution est d’utiliser des gammes comme celle-ci [a-z]at:

gammes

Voici la chaîne complète qui est testée: rat bat cat sat fat cats eat tat cat dog mat CAT.

Comme vous pouvez le voir, tous les mots correspondent comme prévu. J’ai ajouté le mot dog juste pour lancer un match invalide. Voici d’autres façons d’utiliser les plages:

  • Gamme partielle: sélections telles que [a-f] ou [g-p].

  • Gamme capitalisée: [A-Z].

  • Plage de chiffres: [0-9].

  • Plage de symboles: par exemple, [#$%&@].

  • Gamme mixte: par exemple, [a-zA-Z0-9] comprend tous les chiffres, lettres minuscules et majuscules. Notez qu’une plage spécifie uniquement plusieurs alternatives pour un caractère unique dans un modèle.

    Pour mieux comprendre comment définir une plage, il est préférable de consulter la table ASCII complète afin de voir comment les caractères sont ordonnés.

table ascii

Caractères répétitifs

Supposons que vous souhaitiez associer tous les mots de trois lettres. Vous le feriez probablement comme ceci:

[a-z][a-z][a-z]

Cela correspondrait à tous les mots de trois lettres. Mais que faire si vous voulez faire correspondre un mot de cinq ou huit caractères. La méthode ci-dessus est fastidieuse. Il y a une meilleure façon d’exprimer un tel modèle en utilisant le {} notation des accolades. Il vous suffit de spécifier le nombre de caractères répétés. Voici quelques exemples:

  • a{5} correspondra à «aaaaa».
  • n{3} correspondra à “nnn”.
  • [a-z]{4} correspondra à n’importe quel mot de quatre lettres comme «porte», «chambre» ou «livre».
  • [a-z]{6,} correspondra à n’importe quel mot de six lettres ou plus.
  • [a-z]{8,11} correspondra à n’importe quel mot entre huit et 11 lettres. La validation de base du mot de passe peut être effectuée de cette façon.
  • [0-9]{11} correspondra à un nombre à 11 chiffres. La validation téléphonique internationale de base peut être effectuée de cette façon.

Les métacaractères vous permettent d’écrire des modèles d’expression régulière encore plus compacts. Voyons-les un par un:

  • d correspond à n’importe quel chiffre identique à [0-9]
  • w correspond à n’importe quelle lettre, chiffre et caractère de soulignement
  • s correspond à un espace blanc – c’est-à-dire un espace ou une tabulation
  • t correspond uniquement à un caractère de tabulation

D’après ce que nous avons appris jusqu’à présent, nous pouvons écrire des expressions régulières comme ceci:

  • w{5} correspond à tout mot de cinq lettres ou à un nombre à cinq chiffres
  • d{11} correspond à un numéro à 11 chiffres tel qu’un numéro de téléphone

Caractères spéciaux

Les caractères spéciaux nous poussent plus loin dans l’écriture d’expressions de modèle plus avancées:

  • +: Un ou plusieurs quantificateurs (le caractère précédent doit exister et peut être éventuellement dupliqué). Par exemple, l’expression c+at correspondra à “cat”, “ccat” et “ccccccccat”. Vous pouvez répéter le caractère précédent autant de fois que vous le souhaitez et vous obtiendrez toujours une correspondance.

  • ?: Zéro ou un quantificateur (le caractère précédent est facultatif). Par exemple, l’expression c?at ne correspondra qu’à «chat» ou «à».

  • *: Zéro ou plusieurs quantificateurs (le caractère précédent est facultatif et peut être éventuellement dupliqué). Par exemple, l’expression c*at correspondra à “at”, “cat” et “ccccccat”. C’est comme la combinaison de + et ?.

  • : ce «caractère d’échappement» est utilisé lorsque nous voulons utiliser un caractère spécial littéralement. Par exemple, c* correspondra exactement à «c *» et non à «ccccccc».

  • [^]: cette notation «négation» est utilisée pour indiquer un caractère qui ne doit pas être mis en correspondance dans une plage. Par exemple, l’expression b[^a-c]ld ne correspondra pas à “chauve” ou “bbld” car les secondes lettres a à c sont négatives. Cependant, le motif correspondra à «beld», «bild», «bold» et ainsi de suite.

  • .: cette notation «do» correspondra à n’importe quel chiffre, lettre ou symbole, sauf la nouvelle ligne. Par exemple, .{8} correspondra à un mot de passe à huit caractères composé de lettres, de chiffres et de symboles. par exemple, «mot de passe» et «P @ ssw0rd» correspondront tous les deux.

D’après ce que nous avons appris jusqu’à présent, nous pouvons créer une variété intéressante d’expressions régulières compactes mais puissantes. Par exemple:

  • .+ correspond à un ou un nombre illimité de caractères. Par exemple, «c», «cc» et «bcd # .670» correspondront tous.
  • [a-z]+ correspondra à tous les mots en minuscules, quelle que soit leur longueur, tant qu’ils contiennent au moins une lettre. Par exemple, «livre» et «salle de conférence» correspondront tous les deux.

Groupes

Tous les caractères spéciaux que nous venons de mentionner n’affectent qu’un seul caractère ou un ensemble de plages. Et si nous voulions que l’effet s’applique à un section de l’expression? Nous pouvons le faire en créant des groupes à l’aide de crochets ronds – (). Par exemple, le motif book(.com)? correspondra à la fois à “book” et “book.com”, car nous avons rendu la partie “.com” facultative.

Voici un exemple plus complexe qui serait utilisé dans un scénario réaliste tel que la validation des e-mails:

  • modèle: @w+.w{2,3}(.w{2,3})?
  • chaîne de test: abc.com abc@mail @mail.com @mail.co.ke

validation partielle des e-mails

Caractères alternatifs

Dans regex, nous pouvons spécifier des caractères alternatifs en utilisant le symbole “pipe” – |. Ceci est différent des caractères spéciaux que nous avons montrés précédemment car il affecte tous les caractères de chaque côté du symbole de tuyau. Par exemple, le motif sat|sit correspondra aux chaînes “sat” et “sit”. Nous pouvons réécrire le motif comme s(a|i)t pour correspondre aux mêmes chaînes.

Le modèle ci-dessus peut être exprimé comme s(a|i)t en utilisant () parenthèses.

Démarrage et fin des modèles

Vous avez peut-être remarqué que certaines correspondances positives sont le résultat d’une correspondance partielle. Par exemple, si j’ai écrit un modèle pour correspondre à la chaîne «boo», la chaîne «book» obtiendra également une correspondance positive, bien qu’elle ne soit pas exacte. Pour y remédier, nous utiliserons les notations suivantes:

  • ^: placé au début, ce caractère correspond à un motif au début d’une chaîne.
  • $: placé à la fin, ce caractère correspond à un motif à la fin de la chaîne.

Pour corriger la situation ci-dessus, nous pouvons écrire notre modèle comme boo$. Cela garantira que les trois derniers caractères correspondent au modèle. Cependant, il y a un problème que nous n’avons pas encore pris en compte, comme le montre l’image suivante:

notations début-fin

La chaîne «sboo» obtient une correspondance car elle remplit toujours les exigences actuelles de correspondance de modèle. Pour résoudre ce problème, nous pouvons mettre à jour le modèle comme suit: ^boo$. Cela correspondra strictement au mot «boo». Si vous les utilisez tous les deux, les deux règles sont appliquées. Par exemple, ^[a-z]{5}$ correspond strictement à un mot de cinq lettres. Si la chaîne comporte plus de cinq lettres, le modèle ne correspond pas.

Regex en JavaScript

// Example 1
const regex1=/a-z/ig

//Example 2
const regex2= new RegExp(/[a-z]/, 'ig')

Si Node.js est installé sur votre machine, ouvrez un terminal et exécutez la commande node pour lancer l’interpréteur de shell Node.js. Ensuite, exécutez comme suit:

Node regex interactive

N’hésitez pas à jouer avec plus de motifs regex. Une fois terminé, utilisez la commande .exit pour quitter le shell.

Exemple réel: validation des e-mails

Alors que nous concluons ce guide, regardons une utilisation populaire de l’expression régulière, validation par e-mail. (Par exemple, nous pourrions vouloir vérifier qu’une adresse e-mail qu’un utilisateur a saisie dans un formulaire est une adresse e-mail valide.)

Ce sujet est plus compliqué que vous ne le pensez. La syntaxe de l’adresse e-mail est assez simple: {name}@{domain}. En théorie, une adresse e-mail peut contenir un nombre limité de symboles tels que #-@&%. etc. Cependant, l’emplacement de ces symboles est important. Les serveurs de messagerie ont également des règles différentes sur l’utilisation des symboles. Par exemple, certains serveurs traitent le + symbole invalide. Dans d’autres serveurs de messagerie, le symbole est utilisé pour sous-adresse e-mail.

Pour tester vos connaissances, essayez de créer un modèle d’expression régulière qui ne correspond qu’aux adresses e-mail valides indiquées ci-dessous:

# invalid email
abc
abc.com

# valid email address
abc@mail.com
abc@mail.nz
abc@mail.co.nz
abc123@mail.com
abc.def@music.com

# invalid email prefix
abc-@mail.com
abc..def@mail.com
.abc@mail.com
abc#def@mail.com

# valid email prefix
abc-d@mail.com
abc.def@mail.com
abc@mail.com
abc_def@mail.com

# invalid domain suffix
abc.def@mail.c
abc.def@mail#archive.com
abc.def@mail
abc.def@mail..com

# valid domain suffix
abc.def@mail.cc
abc.def@mail-archive.com
abc.def@mail.org
abc.def@mail.com
fully-qualified-domain@example.com

Notez certaines adresses e-mail marquées comme valide peut être invalide pour certaines organisations, tandis que certaines qui sont marquées comme invalide peut en fait être autorisé dans d’autres organisations. Quoi qu’il en soit, apprendre à créer des expressions régulières personnalisées pour les organisations pour lesquelles vous travaillez est primordial afin de répondre à leurs besoins. Si vous êtes bloqué, vous pouvez examiner les solutions possibles suivantes. Notez qu’aucun d’entre eux ne vous donnera une correspondance à 100% sur les chaînes de test de courrier électronique valides ci-dessus.

^w*(-w)?(.w*)?@w*(-w*)?.w{2,3}(.w{2,3})?$
^(([^<>()[]\.,;:s@"]+(.[^<>()[]\.,;:s@"]+)*)|(".+"))@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$

Résumé

J’espère que vous avez maintenant appris les bases des expressions régulières. Nous n’avons pas couvert toutes les fonctionnalités de regex dans ce guide de démarrage rapide, mais vous devriez avoir suffisamment d’informations pour résoudre la plupart des problèmes qui nécessitent une solution de regex. Pour en savoir plus, lisez notre guide sur les meilleures pratiques pour l’application pratique de l’expression régulière dans des scénarios du monde réel.

Close Menu