regex 在你的浏览器中如何工作?
每个 JavaScript 运行时都内置了正则表达式引擎 — new RegExp(pattern, flags) 会编译你的模式,然后 String.prototype.match、String.prototype.replace 和 RegExp.prototype.exec 等方法将其作用于任意输入字符串。此测试器将该引擎包装在一个 UI 中,让你无需离开浏览器即可编辑、运行和检查模式。你输入的任何内容 — 模式、标志、测试字符串或替换 — 都不会通过网络发送。
regex 测试器如何工作?
管道由若干简短步骤组成,全部在客户端的每次按键时执行(采用 150 毫秒去抖以保证输入流畅):
- 你的模式主体从上方字段读取(没有前导或结尾的
/分隔符 — 它们只是装饰)。所选标志按键被拼接为一个标志字符串,如gi或gimsuy。 new RegExp(patternBody, flags)编译模式。如果引擎抛出SyntaxError(例如不匹配的括号或无效转义),消息显示在测试字符串上方,匹配列表被清空。编译错误是 V8 / SpiderMonkey / JavaScriptCore 真正的err.message,因此与你在 DevTools 中看到的一致。- 对于匹配列表,测试器始终使用合成的全局标志进行枚举 — 因此即使你关闭
g,列表仍会显示每个匹配。针对零宽匹配的标准防护 (if (m.index === rx.lastIndex) rx.lastIndex++) 可避免在匹配空字符串的模式上陷入循环。替换模式遵循你真实的标志集,因此$&的行为与String.prototype.replace一致。 - 在每次迭代之间,测试器都会检查
performance.now() - start,一旦经过 50 毫秒就中止。这可防止在如(a+)+$这样的输入上对长串a发生灾难性回溯 — 否则标签页会卡死。该防护属于尽力而为:单次匹配的病态模式仍可能在一次exec调用内消耗时间。如果出现这种情况,请刷新标签页并使用非贪婪量词或原子占有式风格(如[^x]*x)重写模式。 - 测试字符串按每个匹配的范围切分成片段,匹配的片段被包裹在
<mark class="rx-match rx-cap-N">元素中,其中N在六种调色板颜色之间循环,便于一眼区分相邻的匹配。每个匹配的编号分组 (m[1],m[2], …) 和命名分组 (m.groups) 以带标签的行渲染在下方;如果设置了d标志,每个分组的[start, end]索引也会显示。
为什么使用这个 regex 测试器?
- 隐私:每个模式、测试字符串和替换都在你的浏览器中通过内置的 JavaScript RegExp 引擎运行。任何内容都不会离开标签页 — 当输入是客户日志、泄露凭据模式或其他你不会粘贴到托管 SaaS regex 演练场的内容时,这一点尤为重要。
- 诚实风味:测试器准确展示了 Node.js、Chrome、Safari、Firefox 以及所有基于浏览器的表单验证器使用的 regex 引擎。没有 Perl 风味的翻译层来掩盖细微差异 — 在这里能用的,在你的代码中也能用。
- 捕获和命名分组调试:每个编号分组 (
$1,$2, …) 和命名分组 ($<year>) 在每次匹配中显示,因此你可以构建解析器并准确读取槽位。替换模式允许你自由组合分组 —$2-$1交换前两个槽位,$<name>插入命名槽位,$&回显整个匹配。 - 灾难性回溯防护:枚举的 50 毫秒上限会在像
(a+)+$这样的病态模式冻结标签页之前将其中止。你看到的是解释性的错误,而非卡死的浏览器,页面会立即恢复。
regex 测试器的常见用途有哪些?
正则表达式出现在 Web 开发、安全和数据工作中 — 此测试器针对最常见的使用场景:
- 表单验证:原型化邮箱、电话或邮编模式,将示例输入粘贴到测试字符串,并在将模式发送到生产代码之前确认每个正例匹配且每个反例不匹配。
- 日志解析:粘贴一段 NGINX、应用或审计日志输出,针对你关心的部分编写带命名分组的模式 (
(?<ip>…) (?<path>…)),按匹配读取捕获槽位以确认你的解析器是正确的。 - 用于重构的搜索和替换:使用替换模式重写代码片段中的标识符 —
(\w+)\.set(\w+)\(→$1.$2 =将 setter 调用转为属性赋值,实时预览会在你将其提交到 codemod 之前显示结果。
regex 示例是什么样的?
以模式 (\d{4})-(\d{2})-(\d{2}) 加 g 标志,对测试字符串 release 2025-11-15, prerelease 2026-05-25 运行。引擎找到两个匹配。第一个是 2025-11-15,分组 1 = 2025、分组 2 = 11、分组 3 = 15。第二个是 2026-05-25,分组结构相同。在替换模式中,替换模板 $3/$2/$1 将两个日期分别重写为 15/11/2025 和 25/05/2026 — 一个模式实现的 ISO 到 DMY 转换,你可以在把模式接入脚本之前可视化地核对。
在任何 regex 工作中 — 构建、调试或重写模式 — 都把此测试器作为快车道。一切都在本地运行;什么都不记录;regex 引擎就是你浏览器自带的引擎,行为与生产代码在运行时所见一致。