À condition que:
- vous savez ce que vous faites dans votre expression régulière;
- vous avez de nombreux morceaux de regex pour former un motif et ils utiliseront le même drapeau;
- vous trouvez qu'il est plus lisible de séparer vos petits morceaux de motif dans un tableau;
- vous voulez également pouvoir commenter chaque partie pour le prochain développement ou vous-même plus tard;
- vous préférez simplifier visuellement votre regex comme
/this/g
plutôt que new RegExp('this', 'g')
;
- il est normal que vous assembliez le regex en une étape supplémentaire plutôt que de l'avoir en un seul morceau dès le début;
Ensuite, vous pouvez écrire de cette façon:
var regexParts =
[
/\b(\d+|null)\b/,// Some comments.
/\b(true|false)\b/,
/\b(new|getElementsBy(?:Tag|Class|)Name|arguments|getElementById|if|else|do|null|return|case|default|function|typeof|undefined|instanceof|this|document|window|while|for|switch|in|break|continue|length|var|(?:clear|set)(?:Timeout|Interval))(?=\W)/,
/(\$|jQuery)/,
/many more patterns/
],
regexString = regexParts.map(function(x){return x.source}).join('|'),
regexPattern = new RegExp(regexString, 'g');
vous pouvez alors faire quelque chose comme:
string.replace(regexPattern, function()
{
var m = arguments,
Class = '';
switch(true)
{
// Numbers and 'null'.
case (Boolean)(m[1]):
m = m[1];
Class = 'number';
break;
// True or False.
case (Boolean)(m[2]):
m = m[2];
Class = 'bool';
break;
// True or False.
case (Boolean)(m[3]):
m = m[3];
Class = 'keyword';
break;
// $ or 'jQuery'.
case (Boolean)(m[4]):
m = m[4];
Class = 'dollar';
break;
// More cases...
}
return '<span class="' + Class + '">' + m + '</span>';
})
Dans mon cas particulier (un éditeur de type miroir de code), il est beaucoup plus facile d'exécuter une grande regex, plutôt que beaucoup de remplacements comme suit car chaque fois que je remplace par une balise html pour envelopper une expression, le modèle suivant sera être plus difficile à cibler sans affecter la balise html elle-même (et sans le bon lookbehind qui n'est malheureusement pas pris en charge en javascript):
.replace(/(\b\d+|null\b)/g, '<span class="number">$1</span>')
.replace(/(\btrue|false\b)/g, '<span class="bool">$1</span>')
.replace(/\b(new|getElementsBy(?:Tag|Class|)Name|arguments|getElementById|if|else|do|null|return|case|default|function|typeof|undefined|instanceof|this|document|window|while|for|switch|in|break|continue|var|(?:clear|set)(?:Timeout|Interval))(?=\W)/g, '<span class="keyword">$1</span>')
.replace(/\$/g, '<span class="dollar">$</span>')
.replace(/([\[\](){}.:;,+\-?=])/g, '<span class="ponctuation">$1</span>')
let regexSegment1 = String.raw`\s*hello\s*`