es6引入string.prototype.matchall()是为了获取字符串中所有正则匹配的完整信息。1. 它返回一个迭代器，支持惰性求值，减少内存占用；2. 提供每个匹配的捕获组、索引、原始输入等详细信息；3. 必须使用带g标志的正则表达式，否则抛出typeerror；4. 可通过for…of循环逐个处理匹配项，或使用array.from()、展开运算符转换为数组；5. 与match和exec相比，matchall结合了两者的优点，避免手动管理lastindex，简化代码逻辑，适用于需要所有匹配详细信息且追求代码简洁的场景。
ES6中的String.prototype.matchAll方法，提供了一种获取字符串中所有正则表达式匹配项的全新方式，它返回一个迭代器，其中包含了每个匹配的完整信息，包括捕获组、索引等。
解决方案
在ES6中，使用String.prototype.matchAll()来获取字符串中所有匹配项，其核心在于它返回的是一个迭代器，而非直接的数组。这意味着你可以逐个处理匹配项，而无需一次性将所有结果加载到内存中，这对于处理大型字符串或大量匹配时尤其高效。
要使用matchAll，你需要提供一个带有全局标志（g）的正则表达式。如果正则表达式没有g标志，matchAll会抛出一个TypeError。
const text = "这是我的第一句话，也是我的第二句话，更是我的第三句话。";const regex = /我的(S+)句话/g; // 注意这里的 'g' 标志// matchAll返回一个迭代器const matchesIterator = text.matchAll(regex);console.log("--- 遍历迭代器 ---");for (const match of matchesIterator) { console.log(`完整匹配: ${match[0]}`); // 完整的匹配字符串 console.log(`捕获组1: ${match[1]}`); // 第一个捕获组的内容 console.log(`匹配索引: ${match.index}`); // 匹配在原字符串中的起始索引 console.log(`原始输入: ${match.input}`); // 原始字符串 console.log("---");}// 也可以将其转换为数组，以便于一次性处理或调试const matchesArray = Array.from(text.matchAll(regex));console.log("n--- 转换为数组 ---");console.log(matchesArray);// 或者使用展开运算符const matchesSpread = [...text.matchAll(regex)];console.log("n--- 使用展开运算符 ---");console.log(matchesSpread);// 示例：使用命名捕获组const namedRegex = /(?d{2})-(?d{2})-(?d{4})/g;const dateString = "今天是20-03-2023，明天是21-03-2023。";for (const match of dateString.matchAll(namedRegex)) { console.log(`n日期: ${match[0]}`); console.log(` 日: ${match.groups.day}`); console.log(` 月: ${match.groups.month}`); console.log(` 年: ${match.groups.year}`);}
matchAll返回的每个匹配对象，结构上与RegExp.prototype.exec()返回的匹配对象类似，包含：
数组形式的匹配结果（match[0]是完整匹配，match[1]等是捕获组）。index属性：匹配项在原始字符串中的起始索引。input属性：原始的字符串。groups属性：如果正则表达式使用了命名捕获组，则可以通过这个对象访问它们。
为什么ES6引入了matchAll？它解决了哪些痛点？
坦白说，在matchAll出现之前，处理字符串中所有正则表达式匹配项是一件有点“别扭”的事情。你可能会用String.prototype.match()配合全局标志g，但那样只会返回一个包含所有完整匹配字符串的数组，捕获组信息、匹配位置这些关键细节全都丢失了。如果你想获取完整的匹配对象，就得手动写一个循环，配合RegExp.prototype.exec()来反复调用，并且要小心处理正则表达式的lastIndex属性，否则很容易陷入无限循环或者漏掉匹配。
这种手动管理lastIndex的模式，不仅代码写起来啰嗦，而且一不留神就可能出错。它要求开发者对正则表达式的内部工作机制有更深的理解，这无疑增加了学习成本和出错概率。想象一下，每次需要完整匹配信息时，都要写那套模板代码，真是有点烦躁。
matchAll的引入，正是为了解决这种痛点。它提供了一个语义上更清晰、使用上更直观的API，让你能“一次性”地获取所有匹配的完整信息，而无需手动管理迭代状态。它就像一个贴心的工具，把那些繁琐的底层逻辑封装起来，让你能更专注于业务逻辑本身，而不是与API的“怪癖”作斗争。它让代码变得更简洁，也更不易出错。
matchAll返回的迭代器有什么特点？如何有效利用它？
matchAll方法返回的，是一个标准的JavaScript迭代器（Iterator）。这个特性非常关键，因为它决定了你如何消费这些匹配结果，也影响了性能表现。
迭代器的主要特点是惰性求值（Lazy Evaluation）。这意味着matchAll并不会在调用时立即计算出所有的匹配结果并存储起来，而是当你真正需要一个匹配时（比如在for...of循环中），它才会去查找下一个匹配。对于非常大的字符串或者有大量匹配项的场景，这种惰性求值能显著减少内存占用，因为你不需要一次性在内存中保存所有匹配对象。这就像你在看一部很长的电影，不需要把整部电影下载下来才能开始看，而是边下载边播放。
如何有效利用这个迭代器呢？
最直接、也是推荐的方式是使用for...of循环。这是ES6专门为迭代器设计的语法，它能优雅地遍历迭代器中的每一个匹配对象：
const text = "Apple, Banana, Cherry, Date";const fruitRegex = /b(w+a)b/g; // 匹配以'a'结尾的单词for (const match of text.matchAll(fruitRegex)) { console.log(`找到水果: ${match[0]} (在索引 ${match.index} 处)`); // 你可以继续访问 match.groups 或其他属性}
如果你确实需要一个包含所有匹配对象的数组，比如为了后续的数组方法操作（map, filter等），或者只是为了调试方便，你可以将迭代器转换为数组。最常用的方法是：
Array.from()：
const allMatchesArray = Array.from(text.matchAll(fruitRegex));console.log(allMatchesArray);
展开运算符（...）：
const allMatchesSpread = [...text.matchAll(fruitRegex)];console.log(allMatchesSpread);
这两种方法都会立即遍历整个迭代器，并将所有匹配对象收集到一个新数组中。虽然失去了惰性求值的优势，但在需要数组操作时非常方便。
理解迭代器的特性，能让你在处理文本时做出更明智的选择：如果你只是需要逐个处理匹配，for...of是最高效的；如果需要对所有匹配进行集合操作，再转换为数组。
matchAll与match和exec方法有何不同？何时选择matchAll？
要理解matchAll的价值，就必须把它放到String.prototype.match()和RegExp.prototype.exec()这两个“老前辈”的背景下去看。它们各自有不同的侧重和行为，理解这些差异是选择正确工具的关键。
String.prototype.match()
无g标志时：只返回第一个匹配项的完整匹配对象。这个对象包含了捕获组、索引、输入字符串等所有详细信息，与exec返回的类似。
const str = "hello world hello";const result = str.match(/hello/);console.log(result); // ["hello", index: 0, input: "hello world hello", groups: undefined]
有g标志时：返回一个包含所有完整匹配字符串的数组。注意，它只返回匹配的字符串本身，不包含捕获组、索引等详细信息。这是它最大的局限性。
const str = "hello world hello";const result = str.match(/hello/g);console.log(result); // ["hello", "hello"]
何时选择：当你只需要获取第一个匹配的详细信息，或者你只需要获取所有完整匹配的字符串（不关心捕获组和位置）时。
RegExp.prototype.exec()
exec方法每次调用时，都会尝试在字符串中查找下一个匹配项。它返回一个完整的匹配对象（与match无g标志时类似），或者在没有更多匹配时返回null。关键点：如果正则表达式有g标志，exec会更新正则表达式对象的lastIndex属性，从而在下次调用时从上次匹配结束的位置继续查找。你需要手动在一个循环中反复调用exec来获取所有匹配。
const str = "foo bar baz";const regex = /w+/g; // 注意这里的 'g' 标志let match;while ((match = regex.exec(str)) !== null) { console.log(match); // 每次循环都得到一个完整的匹配对象}
何时选择：当你需要逐个处理匹配，并且需要每个匹配的详细信息（包括捕获组和索引），同时可能需要对查找过程进行更细粒度的控制（例如，从特定位置开始查找）。这是matchAll出现之前，获取所有完整匹配的“标准”做法。
String.prototype.matchAll()
必须有g标志：如果正则表达式没有g标志，matchAll会抛出TypeError。返回迭代器：它返回一个迭代器，其中包含了所有匹配项的完整匹配对象（与exec返回的类似）。无需手动管理lastIndex：matchAll内部处理了这一切，你只需要遍历迭代器即可。何时选择：当你需要获取字符串中所有匹配项的完整详细信息（包括捕获组、命名捕获组、索引等）时。当你希望代码更简洁、更易读，避免手动编写while循环和管理lastIndex的复杂性时。当你处理大量匹配或大型字符串时，其惰性求值的特性可以提供更好的内存效率。
简而言之，matchAll是match和exec的“集大成者”，它结合了exec提供完整匹配信息的优点，又简化了match在全局查找时的复杂性。如果你需要所有匹配的详细信息，并且希望代码尽可能地简洁和健美，那么matchAll无疑是ES6时代的首选。它把我们从繁琐的手动循环中解放出来，让正则表达式的全局匹配变得前所未有的优雅。
以上就是ES6中如何用字符串的matchAll获取所有匹配的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1509356.html
微信扫一扫 
支付宝扫一扫 
