Asalkan:
- Anda tahu apa yang Anda lakukan di regexp Anda;
- Anda memiliki banyak potongan regex untuk membentuk pola dan mereka akan menggunakan bendera yang sama;
- Anda merasa lebih mudah dibaca untuk memisahkan potongan pola kecil Anda menjadi sebuah array;
- Anda juga ingin dapat mengomentari setiap bagian untuk dev berikutnya atau diri Anda nanti;
- Anda lebih suka menyederhanakan regex secara visual seperti
/this/g
daripada new RegExp('this', 'g')
;
- tidak apa-apa bagi Anda untuk merakit regex dalam langkah ekstra daripada memilikinya dalam satu kesatuan dari awal;
Maka Anda mungkin ingin menulis seperti ini:
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');
Anda kemudian dapat melakukan sesuatu seperti:
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>';
})
Dalam kasus khusus saya (editor seperti kode), jauh lebih mudah untuk melakukan satu regex besar, daripada banyak penggantian seperti mengikuti karena setiap kali saya mengganti dengan tag html untuk membungkus ekspresi, pola selanjutnya akan lebih sulit untuk target tanpa mempengaruhi tag html itu sendiri (dan tanpa baik lookbehind yang sayangnya tidak didukung dalam 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*`