【在线工具】正则表达式看不懂？把它变成一张图就明白了

正则表达式（Regex）是程序员又爱又怕的东西。

写对了，一行代码能搞定复杂的文本匹配；写错了，对着一串符号半天看不出哪里不对。

土薯工具的「正则表达式可视化」，把你写的正则转成一张结构图，每个部分是什么意思一目了然，同时支持实时文本匹配测试。

🔗 工具地址：https://toolshu.com/regex-visualizer

这个工具能做什么？

① 可视化解析： 输入一个正则表达式，工具自动把它拆解成图形化的结构图——哪部分是字符组、哪部分是量词、哪部分是分组，全部以图形节点展示，看图就能理解逻辑。

② 实时匹配测试： 在测试文本框里输入内容，工具实时高亮标出所有匹配到的部分，马上知道这个正则对不对、匹配到了什么。

③ 结果导出： 可视化图可以导出为 SVG 或图片，方便放进文档、技术分享或学习笔记里。

举个例子

比如这个常见的邮箱验证正则：

^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$

肉眼看这串符号，大概能猜出是邮箱格式，但每个部分具体什么意思不一定说得清楚。

把它丢进可视化工具，图里会清晰地展示：

• ^ 开头锚点
• [a-zA-Z0-9._%+-]+ 用户名部分，允许哪些字符
• @ 字面的@符号
• [a-zA-Z0-9.-]+ 域名主体
• \. 转义的点
• [a-zA-Z]{2,}$ 顶级域名，至少两个字母

每个节点对应原始表达式的哪个片段，选中图里的节点，原始正则对应位置也会高亮。

适合哪些人？

正在学正则的人： 光看教程里的字符说明很难建立直觉，可视化图能帮你快速理解正则的结构逻辑。

写了正则但不确定对不对的人： 直接测试，实时看匹配结果，比自己在脑子里模拟运行靠谱多了。

需要向别人解释正则的人： 技术评审、代码 Review、写文档时，一张结构图比一段文字说明清晰得多，直接导出图片用。

偶尔需要写正则但不熟练的人： 运营写爬虫规则、产品做数据过滤，不需要精通，但能借助工具验证自己写的是否正确。

土薯还有一个正则测试工具

如果你不需要可视化，只是想快速测试正则匹配效果，土薯还有一个更轻量的「正则表达式在线测试」：https://toolshu.com/regex_tester

支持实时替换，并能生成 JavaScript、Python、PHP、Java、Go、Ruby 六种语言的对应代码，直接复制进项目用。

👉 把你的正则变成一张图：https://toolshu.com/regex-visualizer

土薯在线工具 toolshu.com，免费实用工具大全，欢迎收藏。