随着前端技术的不断发展和升级，JavaScript 作为前端开发的核心语言，不断推出新的语法特性以提高开发效率和改善用户体验。ES2020 新增的 JavaScript 正则表达式标志就是其中之一，它为解决自动匹配问题提供了新的解决方案。
正则表达式标志
正则表达式是我们在开发中经常使用的一种匹配规则，一般都需要通过一个特定的格式来进行编写。在 JavaScript 中，正则表达式由两部分组成，分别是正则表达式字面量和正则表达式标志。而 ES2020 新增的 JavaScript 正则表达式标志主要有以下几种：
- g: 全局匹配模式，查找字符串中所有的匹配并返回，而不是找到第一个匹配项就停止匹配。
- i: 不区分大小写模式，使匹配不区分大小写。
- m: 多行匹配模式，查找输入字符串中每一行的匹配项。
自动匹配问题
在使用正则表达式时，我们经常会遇到自动匹配问题，就是在进行全局匹配时，如果找不到匹配的项就会返回 null，不能返回空数组。比如下面的代码：
const str = "Hello World"; const regex = /john/g; const matches = str.match(regex); console.log(matches); // null
在这个例子中，我们需要遍历字符串来查找每一个匹配项，但因为查找到最后没有匹配项，所以返回 null，无法得到预期的结果。
新的解决方案
为了解决自动匹配问题，ES2020 新增的正则表达式标志可以帮助我们实现更加简洁和高效的代码。当我们在验证和提取一段文本时，如果我们没有找到任何匹配项，我们可以使用新的标志来返回一个空数组。比如下面的代码：
const str = "Hello World"; const regex = /john/g; const matches = str.matchAll(regex); console.log([...matches]); // []
可以看到，使用 ES2020 新增的正则表达式标志可以帮助我们更加容易地处理自动匹配问题，提高开发的效率和代码的可维护性。
案例示范
下面是一个用于验证电子邮箱的例子：
-- -------------------- ---- ------- ----- ---------- - -------------------------------------------------- ----- ------ - ------------------------ ---------------------------------- ----------------------------- ----- ------- - ---------------------------- --- ------ ----- -- -------- - ---------------------- -
输出结果为：
first.email@example.com second.email@subdomain.example.com third.email@a.b.example.com
可以看到，在我们使用 ES2020 新增的正则表达式标志进行全局匹配时，可以得到正确的结果。
总结
ES2020 新增的正则表达式标志是一种解决自动匹配问题的好方法，可以帮助我们更快地编写正则表达式代码，提高开发效率和可维护性。对于前端开发人员来说，掌握这些新特性非常重要，可以提高代码质量和开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6489937948841e98947dabac