JavaScript Findall

引言

正则表达式（regex）是匹配字符串模式的强大工具，JavaScript 提供了强大的支持来处理它们。RegExp.prototype.exec() 方法一直是根据正则表达式模式从字符串中提取数据的标准方法。然而，随着 ECMAScript 2020 中引入 String.prototype.matchAll()，处理正则表达式变得更加方便。在本文中，我们将探讨 String.prototype.matchAll() 方法及其如何简化从字符串中提取多个匹配项的过程。

旧方法：RegExp.prototype.exec()

在 String.prototype.matchAll() 引入之前，开发者通常使用 RegExp.prototype.exec() 方法来遍历字符串并检索多个匹配项。考虑一个需要从每个字符串中提取单词 'apple' 所有出现次数的例子。在此示例中，正则表达式 /\bapple\b/g 查找整个单词 'apple'（使用单词边界 \b）和全局标志 g 来查找所有出现。exec() 方法在循环中使用以迭代查找匹配项。

代码

新方法：String.prototype.matchAll()

String.prototype.matchAll() 方法简化了从字符串中提取所有匹配项的过程。它返回一个包含所有匹配的子字符串以及捕获组的迭代器。让我们使用 matchAll() 来修改之前的示例。在这个更新的示例中，text.matchAll(pattern) 返回一个迭代器，该迭代器使用扩展运算符... 被转换为一个数组。生成的数组包含匹配项，我们可以轻松地迭代它们以访问匹配的子字符串及其索引。

代码

示例

代码

输出

[ '123', '456' ]

在此示例中，使用正则表达式 \d+ 来匹配一个或多个数字，并使用 g 标志在给定文本中查找所有出现。match() 方法返回一个包含所有匹配项的数组。在这种情况下，它返回 ['123', '456'] 作为结果。

利用捕获组进行改进

正则表达式中的捕获组允许您提取匹配项的特定部分。String.prototype.matchAll() 简化了这些组的提取。考虑以下示例。在此示例中，模式 /(\w+ \w+) \((\d+)\)/g 匹配名称后跟括号括起来的年龄。捕获组在匹配对象中易于访问，使我们能够提取和使用特定信息。

代码

处理非捕获组

有时，正则表达式可能包含非捕获组（使用 (?: ... )）来分组但不捕获的元素。String.prototype.matchAll() 将这些非捕获组包含在结果中，允许您在处理过程中跳过它们。

代码

结论

随着 String.prototype.matchAll() 的引入，JavaScript 提供了一种更方便处理正则表达式的方法，简化了从字符串中提取多个匹配项的过程。此方法增强了代码的清晰度，并减少了对显式循环的需求，使代码更简洁、更具表现力。考虑将 String.prototype.matchAll() 整合到您的正则表达式工具箱中，以在 JavaScript 中实现高效、简洁的模式匹配。