Les parenthèses
Nous avons vu pour le moment que les regex servaient à voir si une chaîne de caractères correspondait à un modèle. Mais il y a moyen de faire mieux, comme extraire des informations. Pour définir les informations à extraire, on utilise des parenthèses, que l'on appelle parenthèses capturantes, car leur utilité est de capturer une portion de texte, que la regex va extraire.
Considérons cette chaîne de caractères : « Je suis né en mars ». Au moyen de parenthèses capturantes, nous allons extraire le mois de la naissance, pour pouvoir le réutiliser :
var birth = 'Je suis né en mars';
/^Je suis né en (\S+)$/.exec(birth);
alert(RegExp.$1); // Affiche : « mars » |
Cet exemple est un peu déroutant, mais est en réalité assez simple à comprendre. Dans un premier temps, on crée la regex avec les fameuses parenthèses. Comme les mois sont faits de caractères qui peuvent être accentués, on peut directement utiliser le type générique \S. \S+ indique qu'on recherche une série de caractères, jusqu'à la fin de la chaîne (délimitée, pour rappel, par $) : ce sera le mois. On englobe ce « mois » dans des parenthèses pour faire comprendre à l'interpréteur Javascript que leur contenu devra être extrait.
La regex est exécutée via exec(). Et ici une autre explication s'impose. Quand on exécute test() ouexec(), le contenu des parenthèses capturantes est enregistré temporairement au sein de l'objet RegExp. Le premier couple de parenthèses sera enregistré dans
la propriété $1, le deuxième dans $2 et ainsi de suite, jusqu'au neuvième, dans $9. Cela veut donc dire qu'il ne peut y avoir qu'un maximum de neuf couples de parenthèses. Les couples sont numérotés suivant le sens de lecture, de gauche à droite.
Et pour accéder aux propriétés, il suffit de faire RegExp.$1, RegExp.$2, etc.
Voici un autre exemple, reprenant la regex de validation de l'adresse e-mail. Ici, le but est de décomposer l'adresse pour récupérer les différentes parties :
var email = prompt("Entrez votre adresse e-mail :", "javascript@siteduzero.com");
if (/^([a-z0-9._-]+)@([a-z0-9._-]+)\.([a-z]{2,6})$/.test(email)) { alert('Partie locale : ' + RegExp.$1 + '\nDomaine : ' + RegExp.$2 + '\nExtension : ' + RegExp.$3); } else { alert('Adresse e-mail invalide !'); } |
Ce qui nous affiche bien les trois parties :
Les trois parties sont bien renvoyées
Remarquez que même si test() et exec() sont exécutés au sein d'un if() le contenu des parenthèses est quand même enregistré. Pas de changement de ce côté-là puisque ces deux méthodes sont quand même exécutées au sein de la condition.
Il se peut que dans de longues et complexes regex, il y ait besoin d'utiliser beaucoup de parenthèses, plus de neuf par exemple, ce qui peut poser problème puisqu'il ne peut y avoir que neuf parenthèses capturantes exploitables. Mais toutes ces parenthèses n'ont peut-être pas besoin de capturer quelque chose, elles peuvent juste être là pour proposer un choix. Par exemple, si on vérifie une URL, on peut commencer la regex comme ceci :
/(https|http|ftp|steam):\/\//
Mais on n'a pas besoin que ce soit une parenthèse capturante et qu'elle soit accessible via RegExp.$1. Pour la rendre non capturante, on va ajouter ?: au début de la parenthèse, comme ceci :
/(?:https|http|ftp|steam):\/\//
De cette manière, cette parenthèse n'aura aucune incidence sur les propriétés $ de RegExp !
Créé avec HelpNDoc Personal Edition: Générateur d'aide complet