JavaScript - escape special characters in regular expression pattern
In this short article, we would like to show how to escape special characters from patterns that we want to use with regular expressions in JavaScript.
Practical example:
// ONLINE-RUNNER:browser;
const SPECIAL_CHARACTERS_EXPRESSION = /[.*+?^${}()\[\]\\|]/g;
// Escapes regular expression pattern special characters in the indicated string.
//
const escapePattern = (pattern) => {
return pattern.replace(SPECIAL_CHARACTERS_EXPRESSION, '\\$&');
};
// Usage example:
const pattern = escapePattern('.*');
const expression = new RegExp(pattern, 'g');
const text = 'this is example text with .* and .* and .*';
const result = text.match(expression);
console.log(pattern); // '\.\*'
console.log(result); // ['.*', '.*', '.*']
Hint: the above approach is useful when we want to escape all special characters automatically.
Manual escape
We can escape special characters manually by using \ or \\ before them in patterns.
1. Escape in string pattern
In strings, we should escape special characters using \\.
// ONLINE-RUNNER:browser;
const expression = new RegExp('\\.\\*', 'g');
const text = 'this is example text with .* and .* and .*';
const result = text.match(expression);
console.log(result); // ['.*', '.*', '.*']
2. Escape in syntax pattern
In syntax patterns, we should escape special characters using \.
// ONLINE-RUNNER:browser;
const expression = /\.\*/g;
const text = 'this is example text with .* and .* and .*';
const result = text.match(expression);
console.log(result); // ['.*', '.*', '.*']
Optimal solutions
Regular expressions are slower than source code, so using some tricks we are able to get optimal performance on pattern escape.
1. Best performance
escapePattern() function is faster by about 2.5x than the replace-based version.
// ONLINE-RUNNER:browser;
// Escapes regular expression pattern special characters in the indicated string.
//
const escapePattern = (pattern) => {
let result = '';
for (let i = 0; i < pattern.length; ++i) {
const entry = pattern[i];
switch (entry) {
case '.':
case '*':
case '+':
case '?':
case '^':
case '$':
case '{':
case '}':
case '(':
case ')':
case '[':
case ']':
case '|':
case '\\':
result += '\\' + entry;
break;
default:
result += entry;
break;
}
}
return result;
};
// Usage example:
const pattern = escapePattern('.*');
const expression = new RegExp(pattern, 'g');
const text = 'this is example text with .* and .* and .*';
const result = text.match(expression);
console.log(pattern); // '\.\*'
console.log(result); // ['.*', '.*', '.*']
1. Quite good performance:
escapePattern() function is faster by about 1.5x than the replace-based version.
// ONLINE-RUNNER:browser;
const SPECIAL_CHARACTERS = {'.': 1, '*': 1, '+': 1, '?': 1, '^': 1, '$': 1, '{': 1, '}': 1, '(': 1, ')': 1, '[': 1, ']': 1, '|': 1, '\\': 1};
// Escapes regular expression pattern special characters in the indicated string.
//
const escapePattern = (pattern) => {
let result = '';
for (let i = 0; i < pattern.length; ++i) {
const entry = pattern[i];
result += (entry in SPECIAL_CHARACTERS ? '\\' + entry : entry);
}
return result;
};
// Usage example:
const pattern = escapePattern('.*');
const expression = new RegExp(pattern, 'g');
const text = 'this is example text with .* and .* and .*';
const result = text.match(expression);
console.log(pattern); // '\.\*'
console.log(result); // ['.*', '.*', '.*']