在 ES12 中，新增了一个 String.prototype.matchAll 方法，它可以用于在字符串中查找所有匹配的正则表达式，返回一个迭代器，方便我们遍历所有匹配结果。本文将详细介绍 matchAll 的用法及其实际应用场景。
基本用法
matchAll 方法接受一个正则表达式作为参数，返回一个迭代器对象。我们可以使用 for...of 循环遍历迭代器，获取所有匹配结果。
----- --- - ------ ------ ----- ----------- ----- ----- - -------- ----- ------- - ------------------- --- ------ ----- -- -------- - ------------------ -
输出结果为：
--------- ------ -- ------ ------ ------ ----- ------------ ------- ---------- --------- ------ --- ------ ------ ------ ----- ------------ ------- ----------
可以看到，每个匹配结果都是一个数组，包含匹配到的字符串、匹配位置和输入字符串等信息。
迭代器对象
matchAll 方法返回的迭代器对象有两个方法：next 和 Symbol.iterator。
next 方法返回一个包含匹配结果的对象，包括 value、done 两个属性。value 属性为匹配结果数组，done 属性表示是否已经遍历完所有匹配结果。
----- --- - ------ ------ ----- ----------- ----- ----- - -------- ----- ------- - ------------------- --------------------------- -- - ------ --------- ------ -- ------ ------ ------ ----- ------------ ------- ----------- ----- ----- - --------------------------- -- - ------ --------- ------ --- ------ ------ ------ ----- ------------ ------- ----------- ----- ----- - --------------------------- -- - ------ ---------- ----- ---- -
Symbol.iterator 方法返回迭代器对象本身，可以用于实现自定义迭代器。
----- --- - ------ ------ ----- -----------
----- ----- - --------
----- ------- - -------------------
----- ---------- - -
------------------ -------- -- -
------ ----
--
----- -------- -- -
----- ------ - --------------
-- ------------- -
------ - ----- ---- -
- ---- -
------ - ------ ------------ -
-
-
-
--- ------ ----- -- ----------- -
------------------
-带分组的正则表达式
matchAll 方法还支持带分组的正则表达式，每个匹配结果的数组中会包含分组捕获的内容。
----- --- - ------ ------ ----- ----------- ----- ----- - -------- ------- ----- ------- - ------------------- --- ------ ----- -- -------- - ------------------ -
输出结果为：
------- ------- -------- -------- ------ -- ------ ------ ------ ----- ------------ ------- ---------- ------- ------------ -------- ------------- ------ --- ------ ------ ------ ----- ------------ ------- ----------
实际应用场景
matchAll 方法在实际应用中有很多场景，例如：
提取 URL 参数
我们可以使用正则表达式匹配 URL 中的参数，然后使用 matchAll 方法遍历所有匹配结果。
----- --- - ---------------------------------------------- ----- ----- - ----------------------- ----- ------- - ------------------- ----- ------ - -- --- ------ ----- -- -------- - ---------------- - -------- - ------------------- -- - --- ------ ----- ------- ---- ---- -
高亮匹配字符串
我们可以使用正则表达式匹配字符串中的关键词，并将其高亮显示。
----- --- - ------ ------ ----- ----------- ----- ------- - ------- ----- ----- - --- ---------------------- ---- ----- ------- - ------------------- --- ------ - -- --- --------- - - --- ------ ----- -- -------- - ------ -- -------------------- ------------ ------ -- ------ ------------------------------------- --------- - ----------- - --------------- - ------ -- -------------------- ------------------- -- ----- ------------------------------ ------ ----- ------------------------------ ----------
总结
String.prototype.matchAll 方法是 ES12 中新增的一个方法，它可以用于在字符串中查找所有匹配的正则表达式，返回一个迭代器，方便我们遍历所有匹配结果。本文介绍了 matchAll 的基本用法、迭代器对象、带分组的正则表达式以及实际应用场景。在实际开发中，我们可以使用 matchAll 方法提高代码的效率和可读性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65fa80a7d10417a22265e188