Expressions régulières JavaScript au-delà de l'essentiel

Dans notre précédent tutoriel sur les expressions régulières en JavaScript, vous avez appris l’utilité de ces expressions et comment écrire certaines de vos propres expressions pour correspondre à des modèles simples..

Après avoir lu le didacticiel précédent, vous devez maintenant bien comprendre les caractères spéciaux, tels que les barres obliques inverses, et les séquences de caractères, comme \ w ou \ W. Voici un résumé très rapide de ces séquences de caractères:

  1. Vous pouvez utiliser \ré ou \RÉ pour faire correspondre un chiffre ou un caractère non numérique dans une chaîne donnée. Les caractères numériques comprennent 0, 1, 2, 3, 4, 5, 6, 7, 8 et 9. Tous les autres caractères seront associés à \RÉ.
  2. Vous pouvez utiliser \ w ou \ W faire correspondre un mot ou un caractère autre qu'un mot dans une chaîne donnée. Les caractères de mot incluent les alphabets, les chiffres et le trait de soulignement. Tout le reste, comme ₹,%, etc., est considéré comme un caractère autre qu'un mot..
  3. Vous pouvez utiliser \ s ou \ S pour faire correspondre des caractères d'espace ou des caractères non-espace dans une chaîne. Les caractères d'espace incluent espace, tabulation, saut de formulaire et saut de ligne.

Au lieu de faire correspondre un caractère à la fois, vous pouvez utiliser le * symbole pour correspondre à l'expression précédente zéro fois ou plus. le + le caractère correspondra à l'expression précédente 1 ou plusieurs fois.

Vous pouvez faire correspondre un motif autant de fois que vous le souhaitez en ajoutant n, m à cela. Ici, n est le nombre minimum de fois que vous voulez correspondre, et m est la limite maximale. Si vous ne spécifiez pas de valeur pour m, l'expression précédente sera mise en correspondance autant de fois que possible.

Vous devriez consulter mon tutoriel précédent si quelque chose que nous venons de décrire n’est pas clair. J'ai tout expliqué plus en détail ici.

Passons maintenant à des séquences de caractères plus sophistiquées dans les expressions régulières, de manière à pouvoir en tirer le meilleur parti et à comprendre comment écrire des expressions qui correspondent à des modèles compliqués..

Matchs non-gourmands utilisant le ? Personnage

le ? caractère signifie différentes choses dans différentes situations.

Lorsqu'il est utilisé seul, ce caractère correspond à l'expression qui l'a précédé 0 ou 1 fois. En ce sens, c’est la même chose que 0,1.

Vous pouvez aussi utiliser ? immédiatement après d'autres quantificateurs comme *, + et pour correspondre au nombre minimum de caractères possible. En d'autres termes, ces quantificateurs gloutons seront transformés en non gloutons. Cela peut être un peu difficile à comprendre sans regarder des exemples en direct, voyons donc un exemple en premier.

Considérons la phrase suivante:

17321HDGE m'a été attribué comme identifiant d'utilisateur, tandis que mon ami s'est vu attribuer FHES193EK1..

Voyons maintenant toutes les correspondances qui auraient été retournées par différents quantificateurs et leur contrepartie non gourmande.

Si on utilise l'expression / \ d + / g dans l'exemple, il correspondra à un ou plusieurs caractères numériques consécutifs. En raison du drapeau mondial, il y aura trois matchs: 17321, 193, et 1.

Vous devriez noter que 193 et 1 sont considérés comme différents matchs parce qu'ils sont séparés par EK.

L'exemple suivant montre les correspondances sans utilisation de quantificateurs.

var re = / \ d + / g; var count = 0; var textString = "L'ID utilisateur a été attribué à 17321HDGE alors que FHES193EK1 a été attribué à mon ami."; var match = re.exec (textString); while (match! == null) console.log (match [0]); match = re.exec (textString); compter ++;  console.log ("Total de correspondances:" + nombre); / * Sortie 17321 193 1 Total de correspondances: 3 * /

Maintenant, en ajoutant un ? personnage après \ré+ retournera neuf matchs différents. Fondamentalement, / \ d +? / transformera chaque caractère numérique en une correspondance distincte. Pourquoi donc?

C'est parce que \ré+ est par définition censé correspondre à un ou plusieurs chiffres. Depuis le ? le caractère est censé correspondre au nombre minimum de caractères possible, il ne correspond qu'à un chiffre à la fois.

Le non gourmand ? le quantificateur renverra cette fois 9 correspondances à un chiffre plus petites. Par souci de brièveté, j'ai commenté la ligne qui enregistre les correspondances sur la console..

var re = / \ d +? / g; var count = 0; var textString = "L'ID utilisateur a été attribué à 17321HDGE alors que FHES193EK1 a été attribué à mon ami."; var match = re.exec (textString); while (match! == null) // console.log (match [0]); match = re.exec (textString); compter ++;  console.log ("Total de correspondances:" + nombre); / * Correspondances totales en sortie: 9 * /

Prenons un autre exemple. L'expression régulière / \ w + / conservera les caractères correspondant aux mots tant qu'ils ne sont pas interrompus par un caractère autre qu'un mot, comme l'espace. Dans notre cas, cela correspond à des mots entiers, séparés par des espaces, comme attribué et 17321HDGE une fois.

Si nous remplaçons notre expression rationnelle originale par / \ w + /, nous aurons 14 matchs différents. Fondamentalement, chaque mot sera son propre match. Vous pouvez voir le résultat vous-même en commentant la ligne..

var re = / \ w + / g; var count = 0; var textString = "L'ID utilisateur a été attribué à 17321HDGE alors que FHES193EK1 a été attribué à mon ami."; var match = re.exec (textString); while (match! == null) // console.log (match [0]); match = re.exec (textString); compter ++;  console.log ("Total de correspondances:" + nombre); / * Correspondances totales en sortie: 14 * /

Maintenant, changer l'expression pour / \ w +? / retournera chaque caractère du mot en tant que correspondance, et vous obtiendrez 68 correspondances.

Regardons un dernier exemple avant de continuer. L'expression régulière / \ w 4, / renverra tous les mots de notre phrase de quatre caractères ou plus. Donc ça correspond avoir, été, attribué, et 17321HDGE, parmi d'autres. Passons maintenant à / \ w 4,? / renverrait plusieurs correspondances de mots avec plus de quatre caractères. Dans notre exemple, les correspondances retournées seraient avoir, été, assi, gned, 1732, et 1HGD. Le personnage E au bout du 17321HDGE ne fait partie d'aucun matchparce qu'il ne peut pas être dans le groupe de quatre caractères de mot consécutifs.

var re = / \ w 4, / g; var count = 0; var textString = "L'ID utilisateur a été attribué à 17321HDGE alors que FHES193EK1 a été attribué à mon ami."; var match = re.exec (textString); while (match! == null) console.log (match [0]); match = re.exec (textString); compter ++;  console.log ("Total de correspondances:" + nombre); / * Les utilisateurs 17321HDGE attribués à la sortie ont été attribués à un ami.

Utiliser des parenthèses avec le? Personnage

Dans mon précédent tutoriel sur les expressions rationnelles, j'ai brièvement expliqué comment utiliser les parenthèses pour mémoriser une partie d'une correspondance. Lorsqu'il est utilisé avec un ? caractère, ils peuvent servir à d'autres fins.

Parfois, vous souhaitez qu'un groupe de caractères corresponde comme une unité. Par exemple, vous pourriez rechercher les occurrences de n / a une ou deux fois comme correspondance dans le texte suivant.

na naa nnaa nana naana

Pour plus de clarté, vous recherchez le texte en gras sous forme de correspondances: n / a n / aunn / aune (nana) n / aunen / a. La partie entre parenthèses est supposée correspondre à une unité, elle compte donc pour une seule correspondance..

Presque tous ceux qui débutent avec regex utiliseront l'expression / na 1,2 / avec l'intention d'obtenir le résultat attendu. Dans leur esprit, le 1,2 partie est censée correspondre à une ou deux occurrences de n et une ensemble. Cependant, cela correspond en fait à une seule occurrence de n suivi de 1 ou 2 occurrences du personnage une.

J'ai rendu les allumettes retournées par / na 1,2 / en gras pour clarification: n / a naa nnaa (na) (na) (naa) (na). Les parties entre parenthèses sont des correspondances séparées. Comme vous pouvez le constater, nous n’obtenons pas le résultat escompté car 1,2 ne considère pas n / a être une seule unité qui doit être jumelée.

La solution ici consiste à utiliser des parenthèses pour indiquer à JavaScript de correspondre n / a en tant qu'unité. Cependant, comme nous l'avons vu dans le précédent tutoriel, JavaScript commencera à se souvenir de la correspondance en raison des parenthèses.

Si vous ne voulez pas que JavaScript se souvienne du match, vous devrez alors ajouter ?: avant le groupe de caractères que vous essayez de faire correspondre. Dans notre cas, l'expression finale deviendrait / (?: na) 1,2 /. Le groupe n / a seront appariés comme une unité maintenant, et on ne s'en souviendra pas. J'ai mis en évidence les matchs finaux renvoyés avec cette expression en gras: n / a n / aunn / aune (nana) n / aunen / a.

L'exemple suivant enregistre toutes les correspondances sur la console. Puisqu'il y a 6 matches au total, le nombre total de matchs est de 6.

var re = / (?: na) 1,2 / g; var count = 0; var textString = "na na nna na nana naana"; var match = re.exec (textString); while (match! == null) console.log (match [0]); match = re.exec (textString); compter ++;  console.log ("Total de correspondances:" + nombre); / * Résultat na na na na na na Total total: 6 * /

Lookahead et Négé Lookahead

Il existe de nombreuses situations dans lesquelles nous cherchons à faire correspondre un jeu de caractères donné, mais uniquement s’ils sont ou non suivis par un autre jeu de caractères. Par exemple, vous pourriez chercher le mot pommes dans un texte, mais ne veulent que ces correspondances qui sont suivies par sont. Considérons la phrase suivante.

les pommes sont délicieux. Nous avons mangé des pommes toute la journée. Tous ceux qui mangeaient des pommes les aimaient.

Dans l'exemple ci-dessus, nous voulons simplement que le premier mot soit une correspondance. Toute autre occurrence du mot ne devrait pas être dans les allumettes.

Une façon d'y parvenir consiste à utiliser l'expression régulière suivante a (? = b). Le mot que nous voulons assortir est une, et le mot qui devrait venir après une est b. Dans notre cas, l'expression deviendrait / pommes (? = \ sare) /. Rappelez-vous que le mot sont n'est pas inclus dans ce match.

var re = / pommes (? = \ sare) / g; var count = 0; var textString = "Les pommes sont délicieuses. Nous avons mangé des pommes toute la journée. Tous ceux qui mangeaient des pommes les aimaient."; var match = re.exec (textString); while (match! == null) console.log (match [0]); match = re.exec (textString); compter ++;  console.log ("Total de correspondances:" + nombre); / * Pommes en sortie Total de correspondances: 1 * /

Cette expression régulière, dans laquelle nous examinons ce qui vient dans la chaîne avant de décider si le mot est une correspondance, s’appelle un lookahead.

Une situation très similaire se produirait si vous décidiez de faire correspondre pommes seulement si c'était ne pas suivi d'un ensemble spécifique de caractères. Dans ce cas, vous devez remplacer ?= avec ?! dans votre expression habituelle. Si nous recherchions toutes les occurrences de pommes qui sont ne pas suivi par sont, nous utiliserons / pommes (?! \ sare) / comme notre expression régulière. Il y aura deux correspondances réussies pour notre phrase test.

var re = / pommes (?! \ sare) / g; var count = 0; var textString = "Les pommes sont délicieuses. Nous avons mangé des pommes toute la journée. Tous ceux qui mangeaient des pommes les aimaient."; var match = re.exec (textString); while (match! == null) console.log (match [0]); match = re.exec (textString); compter ++;  console.log ("Total de correspondances:" + nombre); / * Pommes de sortie Pommes Résultats totaux: 2 * /

Une dernière chose: vous n'avez pas besoin d'utiliser deux expressions régulières distinctes pour trouver toutes les correspondances suivies par l'un des deux mots donnés. Tout ce que vous avez à faire est d’ajouter l’opérateur de pipe entre ces mots, et vous êtes prêt à partir. Par exemple, si vous recherchez toutes les occurrences de pomme suivies de sont ou étaient, Tu devrais utiliser / pommes (?! \ sare | \ swere) / comme votre expression régulière.

Dernières pensées

Dans ce didacticiel, nous avons appris à écrire des expressions régulières complexes pour correspondre aux modèles recherchés. Nous pouvons utiliser la spéciale ? caractère pour renvoyer le nombre minimal requis du caractère précédent sous forme de correspondance. De même, nous pouvons utiliser le ? entre parenthèses pour vous assurer que le groupe auquel nous correspondions n'est pas mémorisé. 

Enfin, nous avons appris que le ?= et ?! Les séquences de caractères dans une expression régulière nous permettent de renvoyer un jeu de caractères particulier sous forme de correspondance uniquement si elles sont ou non suivies d'un autre jeu de caractères donné..

Si vous avez des questions concernant ce tutoriel, n'hésitez pas à me le faire savoir et je ferai de mon mieux pour les expliquer..