三款可视化工具,帮你学会 JS 正则表达式!

上官追风 2020/6/30 5:26:27

最近老王对可视化非常着迷。 例如,算法可视化、正则可视化、Vue 数据劫持可视化...... 程序的运行过程是看不见摸不着的,如果能够全部实现可视化,那么理解难度将会大幅度减小。 三款 JS 正则可视化工具https://jex.im/regulexhttps://regexper.com (网络需自由)https:/…

最近老王对可视化非常着迷。

例如,算法可视化、正则可视化、Vue 数据劫持可视化......

程序的运行过程是看不见摸不着的,如果能够全部实现可视化,那么理解难度将会大幅度减小。

三款 JS 正则可视化工具

  • https://jex.im/regulex
  • https://regexper.com (网络需自由)

    • https://aoxiaoqiang.github.io... (替代工具)
  • https://www.debuggex.com

常见正则表达式

以下图片由https://jex.im/regulex生成

邮箱

只允许英文字母、数字、下划线、英文句号、以及中划线组成

^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$

电话

手机号码

13012345678 手机号码

^1(3|4|5|6|7|8|9)\d{9}$

固定电话

XXX-XXXXXXX XXXX-XXXXXXXX 固定电话

(\(\d{3,4}\)|\d{3,4}-|\s)?\d{8}

域名

https://google.com/

^((http:\/\/)|(https:\/\/))?([a-zA-Z0-9]([a-zA-Z0-9\-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,6}(\/)

IP

127.0.0.1

((?:(?:25[0-5]|2[0-4]\d|[01]?\d?\d)\.){3}(?:25[0-5]|2[0-4]\d|[01]?\d?\d))

帐号校验

laowang_001 字母开头,允许 5 - 16 字节,允许字母数字下划线

^[a-zA-Z][a-zA-Z0-9_]{4,15}$

字符校验

汉字

前端老王

^[\u4e00-\u9fa5]{0,}$

英文和数字

^[A-Za-z0-9]+$

长度为 3 - 20 的所有字符

^.{3,20}$

英文字符

由 26 个英文字母组成的字符串

^[A-Za-z]+$

由 26 个大写英文字母组成的字符串

^[A-Z]+$

由 26 个小写英文字母组成的字符串

^[a-z]+$

由数字和 26 个英文字母组成的字符串

^[A-Za-z0-9]+$

由数字、26 个英文字母或者下划线组成的字符串

^\w+$

中文、英文、数字包括下划线

^[\u4E00-\u9FA5A-Za-z0-9_]+$

中文、英文、数字但不包括下划线等符号

^[\u4E00-\u9FA5A-Za-z0-9]+$

禁止输入含有%&',;=?$"等字符

[^%&',;=?$\x22]+

禁止输入含有~的字符

[^~\x22]+

数字正则

整数

^-?[1-9]\d*$

正整数
^[1-9]\d*$

负整数
^-[1-9]\d*$

非负整数
^[1-9]\d*|0$

非正整数
^-[1-9]\d*|0$

浮点数

^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$

正浮点数
^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$

负浮点数
^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$

非负浮点数
^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$

非正浮点数
^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$

感谢关注

文章首发在公众号:前端时空
三款可视化工具,帮你学会 JS 正则表达式

随时随地学软件编程-关注百度小程序和微信小程序
关于找一找教程网

本站文章仅代表作者观点,不代表本站立场,所有文章非营利性免费分享。
本站提供了软件编程、网站开发技术、服务器运维、人工智能等等IT技术文章,希望广大程序员努力学习,让我们用科技改变世界。
[三款可视化工具,帮你学会 JS 正则表达式!]http://www.zyiz.net/tech/detail-141543.html

上一篇:周末在学习正则,学习过程中发现这 6 个方便的正则表达式

下一篇:发布 @umijs/plugin-qiankun 2.3.0 - 全面拥抱 qiankun2

赞(0)

共有 条评论 网友评论

验证码: 看不清楚?
    关注微信小程序
    程序员编程王-随时随地学编程

    扫描二维码或查找【程序员编程王】

    可以随时随地学编程啦!

    技术文章导航 更多>
    扫一扫关注最新编程教程