# 正则 - 转义特殊字符
# 背景
有时候会遇到前端过滤的场景，通过用户输入来过滤列表数据，一般将用户输入的字符串转换成正则表达式来进行匹配。
const dataList = [
{name:'tony'},
{name:'钢蛋'},
{name:'rem'},
{name:'rem486'}
];
const input = `rem`;
const reg = new RegExp(input, 'i');
const showData = dataList.filter(i => reg.test(i.name));
console.log(showData);
// [{"name":"rem"},{"name":"rem486"}]
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
如果用户直接输入 *，则没法直接转换成正则表达式。会得到这样的报错：Uncaught SyntaxError: Invalid regular expression。
const input = `*`;
const reg = new RegExp(input,'i');
// VM168:1 Uncaught SyntaxError: Invalid regular expression: /*/: Nothing to repeat
// at new RegExp (<anonymous>)
// at <anonymous>:1:14
1
2
3
4
5
2
3
4
5
所以需要先进行转义处理。
# 转义
正则表达式中特殊字符，有些是具有特殊含义的。直接传入的话，可能会有语法错误，无法正确解析。必须通过在它前面放一个反斜杠 \ 来转义它。例如：要搜索 * 星号，就需要使用 /\*/ ，加一个反斜杠来转义 *，使其成为一个“文字”，而不是正则表达式中的特殊符号。
如果是通过 RegExp 构造函数传入字符串文字来生成正则表达式，需要在字符串文字的时候就完成转义。/a\*b/ 和 new RegExp('a\\*b') 是一样的。
function escapeRegExp(string) {
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
//$&表示整个被匹配的字符串
}
const input = `*`;
const reg = new RegExp(escapeRegExp(input),'i');
console.log(reg);
// /\*/i
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8