在前端开发中，我们常常需要对字符串进行操作和处理，例如正则表达式匹配。在 ES10 中，String 类型新增了 matchAll() 方法，该方法可以帮助我们更简单地匹配多个结果。
matchAll() 方法简介
matchAll() 方法用于在字符串中寻找所有符合正则表达式的子串，并返回一个迭代器。该迭代器可以用于遍历所有匹配结果，并提取需要的信息。
该方法的语法如下：
-----------------------
其中，regexp 表示正则表达式对象，可以是直接量或者使用 RegExp 构造函数创建的对象。该方法返回一个迭代器对象，可以通过 for...of 循环进行遍历。
matchAll() 方法应用
现在，我们来看一个实际的例子。假设我们有一个字符串，需要从中提取电话号码。下面是一个模拟的字符串：
----- --- - ------- ------- -- -- --------------- -- ---------------- --- ---------- ---- ------
我们可以使用正则表达式来匹配其中的电话号码。首先，我们需要定义一个匹配规则：
----- ------ - -------------------------------
其中，+ 表示匹配 + 符号，\d{1} 表示匹配 1 个数字，-\d{3} 表示匹配 3 个数字和一个 - 符号，重复 3 次，即匹配电话号码的格式 +1-123-456-7890。
接下来，我们可以使用 matchAll() 方法来匹配所有的电话号码，代码如下：
----- ------- - --------------------- --- ------ ----- -- -------- - ---------------------- -
运行上述代码，输出结果如下：
--------------- ---------------
上述代码中，我们使用 for...of 循环遍历匹配结果迭代器，其中每个迭代器对象都包含一个 groups 属性和一个 index 属性。groups 属性是一个对象，包含所有的捕获组匹配的结果，index 属性表示匹配结果在字符串中的索引位置。
需要注意的是，matchAll() 方法仅在支持 ES10 版本的浏览器中才可以使用。如果需要在低版本浏览器中使用该方法，可以使用 babel 等工具进行转换。
总结
通过以上例子，我们可以看到，matchAll() 方法简化了正则表达式匹配的流程，帮助我们更轻松地获取多个匹配结果。在实际开发中，我们也可以将该方法应用到其他场景中，例如从 HTML 文档中提取特定标签或者属性等。同时，我们需要注意浏览器兼容性，避免低版本浏览器无法使用该方法。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64e16ce5f6b2d6eab3c9664e