解决 ES9 中非以‘/’开头的正则表达式问题

在 ES9 中，正则表达式成了一个重点。不过，有一些开发者注意到，在某些情况下，非以‘/’开头的正则表达式无法正常解析。比如下面这个例子：

const regExp = new RegExp("\d{3}-\d{3}-\d{4}");

这应该是一个匹配电话号码的正则表达式。然而，它会报错，提示“Invalid regular expression: missing /”。

这个问题的原因是，在 ES9 中，非以‘/’开头的正则表达式有了新的含义，被称为“pattern flags”。而这个新的含义与我们通常使用正则表达式的方式不同，导致了上述错误。那么，我们该如何解决这个问题呢？

解决方案

解决这个问题很简单，只需要将正则表达式转换成字符串的形式，然后将其作为第一个参数传递给 RegExp 构造函数即可。也就是说，上面的例子可以这样写：

const regExp = new RegExp("\\d{3}-\\d{3}-\\d{4}");

需要注意的是，在转换后的字符串中，原来的反斜线需要再次转义，这样才能正确匹配。

还可以使用模板字符串来简化代码：

const regExp = new RegExp(`\\d{3}-\\d{3}-\\d{4}`);

示例代码

// 非以‘/’开头的正则表达式
const regExp1 = new RegExp("\d{3}-\d{3}-\d{4}"); // 报错

// 解决方案：将正则表达式转换成字符串形式
const regExp2 = new RegExp("\\d{3}-\\d{3}-\\d{4}");

// 使用模板字符串简化代码
const regExp3 = new RegExp(`\\d{3}-\\d{3}-\\d{4}`);

总结

解决 ES9 中非以‘/’开头的正则表达式问题，可以将正则表达式转换成字符串形式，再传递给 RegExp 构造函数，或者使用模板字符串简化代码。这样可以避免“pattern flags”的影响，让代码更清晰易懂。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/648ae42d48841e989492f71c