在日常的前端开发中，字符串的操作是非常常见的。针对字符串的匹配操作，目前在ES6规范中已经提供了一些API，例如String.prototype.match()、String.prototype.search()等方法。而在ECMAScript 2021中，又新增了一个名为String.prototype.matchAll()的方法，对字符串的匹配操作作出了更为完备的解决方案。
简介
String.prototype.matchAll()是ES2021中的新增方法，它返回一个正则表达式在当前字符串中匹配所有结果的迭代器。与String.prototype.match()不同的是，它返回的是一个迭代器，可以通过循环来依次获取匹配的结果。下面是该方法的基本语法及其参数：
str.matchAll(regexp)
其中，regexp表示一个正则表达式对象，用于进行字符串的匹配操作。需要注意的是，regexp必须是全局的，即带有g标志位符。
用法示例
下面我们通过一些示例来说明String.prototype.matchAll()的使用方法。
示例1：匹配所有结果
-- -------------------- ---- ------- ----- --- - ------ -------- ----- ------ - ----- ----- ------ - --------------------- --- ------ ----- -- ------- - ------------------- - -- - ---- ------ -- ------ ------ ------- - -- - ---- ------ -- ------ ------ ------- - -- - ---- ------ -- ------ ------ ------- -
在本例中，我们使用正则表达式/l/g来匹配字符串'hello world!'中的所有l字母，并将返回的迭代器遍历一遍，输出匹配的结果。
示例2：使用分组捕获匹配结果
-- -------------------- ---- ------- ----- --- - ------ -------- ----- ------ - ---------- ----- ------ - --------------------- --- ------ ----- -- ------- - ------------------- - -- - ----- ---- ---- ------ -- ------ ------ ------- - -- - ----- ---- ---- ------ -- ------ ------ ------- -
在本例中，我们使用正则表达式/(l)(o)/g来匹配字符串'hello world!'中的lo或ld，并使用分组来捕获l和o/d匹配的结果，即['lo', 'l', 'o']和['ld', 'l', 'd']。通过遍历迭代器，我们可以获取到所有的匹配结果和分组所捕获的内容。
示例3：处理具有多行的字符串
-- -------------------- ---- ------- ----- --- - ------------------------ ----- ------ - ----------- ----- ------ - --------------------- --- ------ ----- -- ------- - ------------------- - -- - ---------- -------- ------ -- ------ ----------------------- - -- - ----------- --------- ------ -- ------ ----------------------- - -- - --------- --------- ------ --- ------ ----------------------- -
在本例中，我们使用正则表达式/(\w+)\n/g来匹配一个多行字符串'apple\norange\nbanana'。该正则表达式使用一个分组来捕获每一行字符串的内容，并使用\n来匹配换行符。需要注意的是，这里使用的是g标志位符，因此可以匹配所有的行，而不仅仅是第一行。
总结
String.prototype.matchAll()是一个用于匹配字符串的全新API。与传统的正则表达式匹配方法相比，它返回的是一个迭代器，可以方便地遍历所有匹配结果。同时，在处理多个匹配结果时，它的使用也比较简单方便。当然，正则表达式的使用依然是有一定复杂度的，需要我们花费一定精力来学习和掌握。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a7ec4d48841e989448c3d3