What are the regular expressions commonly used on the front end?

这次给大家带来前端常用的正则表达式有哪些，使用前端常用正则表达式的注意事项有哪些，下面就是实战案例，一起来看一下。

前言

正则这东西吧,感觉是开发的都会接触到一些..

那些所谓的基础语法就不说了哈,一搜一大把,来点实际的.

我这里就分享下我工作中汇总和遇到的,希望对一些小伙伴有些许帮助哈!!

正则汇总

匹配URL

const regexURL = /((https?|ftp)?:\/\/)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/gi;
// 这条正则可以匹配这么一坨格式的url
//www.baidu.com
//http://www.baidu.com
//https://www.baidu.com
//baidu.com
//test.baidu.com  
//gds.baidu.com
//ftp://www.baidu.com
// ---- 分割线 ---- 
// 也许有小伙伴不需要匹配这么一大坨,只要匹配http和https,上面的改写一下就好了
const regexURL = /(https?:\/\/)(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/gi;
//http://www.baidu.com
//https://www.baidu.com

匹配中国身份证不大靠谱版

// 为什么说不靠谱,是因为单单正则没法实现区域结合出生日期的判断这种很精准的识别
const regexCHINAIDCARD = /^((1[1-5])|(2[1-3])|(3[1-7])|(4[1-6])|(5[0-4])|(6[1-5])|71|(8[12])|91)\d{4}((19\d{2}(0[13-9]|1[012])(0[1-9]|[12]\d|30))|(19\d{2}(0[13578]|1[02])31)|(19\d{2}02(0[1-9]|1\d|2[0-8]))|(19([13579][26]|[2468][048]|0[48])0229))\d{3}(\d|X|x)?$/gi;
// 可以匹配这么一堆身份证,身份证号码都是网络搜索的,一搜一堆
//230381198104143414
//650201199007186135
//460106197707275739
//44200019860325932X
//43052819880216450X
//654223197502255401

匹配数字,整数,浮点~~~

// 这货只会匹配正整数
const regexInteger = /^\d+$/gi;
// 肯定有人想问,范围性的整数呢,看我改下,比如0-100
const regexRangeInteger = /^\d$|^[1-9]\d$|^100$/gi;
// 匹配小数呢,不限定范围的
const regexFloat = /^\d+\.\d+$/gi
// 倘若要限定呢,比如还是那个,0~100的任意整数和浮点数
const regexRangeIntFloat = /^(\d{0,2}(\.\d+)?|100(\.0+)?)$/gi;

匹配手机号码

// 不含卫星电话这些,只是罗列的常见的手机范围,也考虑了区域和长途前缀
const regexMobileNumber = /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/gi;

匹配邮箱

const regexEmail = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9_]+\.)+[a-zA-Z]{2,}))$/gi
// 已经不靠谱的测试了这么几种写法的邮箱格式都通过了
//cc011@qq.com
//fsdlk@dd-fad.cn
//df_fs2.q@jd-f.com
//crklej-dsfj@132.com
//fdfkj@aa_fslkdfj.com.cn
//d390.fslk@qq.com
//1100@gmail.cn
//sflk-98_dsf@qq_fsk.com

加强版密码设置规范

// 必须含有大小写字母,数字及特殊符号,长度8~24
const regexEnhancePassword = /^(?!\s)((?=.*[a-zA-Z])(?=.*[a-z])(?=.*[A-Z])(?=.*[\W_]).\S{8,24})$/g;

中国车牌号校验

const regexCarLicense = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/g;

匹配QQ号,微信号

// QQ在我印象中好像一直都是纯数字,现在好像发展到11位了,好像最初是从100000开始的
const regexQQNumber = /^[1-9]\d{5,10}$/gi;
// 特意去查了下最新的微信号的规则
//1、微信号是微信的唯一凭证，只能设置1次；
//2、可使用6-20个字母、数字、下划线和减号；
//3、必须以字母开头（字母不区分大小写）；
//4、不支持设置中文。
const regexWeChatNumber = /^[A-Za-z][\w-]{5,19}$/gi;

用户名规范

// 普通版,英文+数字,必须字母开头,允许下划线,长度八到十六
const regexNormalUsername = /^[a-zA-Z]\w{7,15}$/gi;
// 在这个基础上允许中文四到六个字符
const regexE1 = /^[\u4e00-\u9fa5]{4,6}$|^[a-zA-Z]\w{7,15}$/gi;
// 多重复用版本,允许手机,邮箱,中文,这个若是写成一个的话,用分组的写法就好了
// 不过很长很长,,,推荐用if...else ...来拆分,,就三个正则....

我没有那么多奇奇怪怪的正则,这些都是工作中很常见的,

所有正则都是经过真实环境下的考验,不是假想推断的正则….

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

Linux grep与正则表达式的使用

正则表达式匹配URL、电话、手机、邮箱的方法

怎么用正则把字符串分组

The above is the detailed content of What are the regular expressions commonly used on the front end?. For more information, please follow other related articles on the PHP Chinese website!