常用JavaScript正则表达式汇编与示例详解

1.1 前言

目前收集整理了21个常用的javaScript正则表达式,其中包括用户名、密码强度、整数、数字、电子邮件地址(Email)、手机号码、身份证号、URL地址、 IP地址、 十六进制颜色、 日期、 微信号、车牌号、中文正则等。表单验证处理必备,赶紧收藏吧!

还会陆续加入新的正则进来,大家多提宝贵意见!

2.1 用户名正则

2.1.1 基本用户名正则

在做用户注册时,都会用到用户名正则校验。

定义基本用户名命名规则如下:

  1. 最短4位,最长16位 {4,16}
  2. 可以包含小写大母 [a-z] 和大写字母 [A-Z]
  3. 可以包含数字 [0-9]
  4. 可以包含下划线 [ _ ] 和减号 [ - ]
  5. 首字母只能是大小写字母
var pattern = /^[a-zA-Z][a-zA-Z0-9_-]{3,15}$/;
//输出 true
console.log("ifat3 : "+pattern.test('ifat3'));
//输出 true
console.log("Ifat3 : "+pattern.test('Ifat3'));
//输出 true
console.log("ke30 : "+pattern.test('ke30'));
//输出 false
console.log("30ke : "+pattern.test('30ke'));
//输出 false
console.log("ke3 : "+pattern.test('ke3'));
输出 false
console.log("ke30@ : "+pattern.test('ke30@'));
//输出 false
console.log("ke30ke30ke30ke30ke30 : "+pattern.test('ke30ke30ke30ke30ke30'));

2.1.2 中文用户名正则

如果规则中加入允许中文用户名,则变更正则表达式如下:

var pattern = /^[a-zA-Z\u4E00-\u9FA5][a-zA-Z0-9\u4E00-\u9FA5_-]{3,15}$/;
//输出 true
console.log("ifat3 : "+pattern.test('ifat3'));
//输出 true
console.log("Ifat3 : "+pattern.test('Ifat3'));
//输出 true
console.log("三十课毛瑞 : "+pattern.test('三十课毛瑞'));
//输出 false
console.log("30ke : "+pattern.test('30ke'));
//输出 false
console.log("ke3 : "+pattern.test('ke3'));
//输出 false
console.log("ke30@ : "+pattern.test('ke30@'));
 //输出 false
console.log("ke30ke30ke30ke30ke30 : "+pattern.test('ke30ke30ke30ke30ke30'));

其中[\u4E00-\u9FA5]是汉字的正则匹配,包括基本汉字2万多个,其中\u4E00表示汉字“一”,具体请参见《汉字unicode编码范围》。

2.2 密码强度正则

//密码强度正则,最少6位,包括至少1个大写字母,1个小写字母,1个数字,1个特殊字符
var pPattern = /^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;
//输出 true
console.log("iFat3#:"+pPattern.test("iFat3#"));

上述正则表达式只能对用户密码强度进行基本的通过性判定,关于密码强度验证更多的内容可参见:基于规则评分的密码强度检测算法分析及实现。

2.3 数字相关正则

2.3.1 整数正则

//正整数正则
var posPattern = /^\d+$/;
//负整数正则
var negPattern = /^-\d+$/;
//整数正则
var intPattern = /^-?\d+$/;
//输出 true
console.log("30:"+posPattern.test("30"));
//输出 true
console.log("-30:"+negPattern.test("-30"));
//输出 true
console.log("-30:"+intPattern.test("-30"));

2.3.2 浮点数正则

//正浮点数正则
var posPattern = /^\d*\.\d+$/;
//负浮点数正则
var negPattern = /^-\d*\.\d+$/;
//两位小数正则
var twoPattern = /^-?\d*\.\d{2}$/;
//输出 true
console.log("30.2:"+posPattern.test("30.2"));
//输出 true
console.log("-30.2:"+negPattern.test("-30.2"));
//输出 true
console.log("-30.22:"+twoPattern.test("-30.22"));

2.3.3 整数浮点数正则

可以是整数也可以是浮点数

//正数正则
var posPattern = /^\d*\.?\d+$/;
//负数正则
var negPattern = /^-\d*\.?\d+$/;
//数字正则
var numPattern = /^-?\d*\.?\d+$/;
//输出 true
console.log("30.2:"+posPattern.test("30.2"));
//输出 true
console.log("-30.2:"+negPattern.test("-30.2"));
//输出 true
console.log("-30.2:"+numPattern.test("-30.2"));

2.4 日期正则

2.4.1 出生日期正则

var pattern = /^((19[2-9]\d{1})|(20((0[0-9])|(1[0-8]))))\-((0?[1-9])|(1[0-2]))\-((0?[1-9])|([1-2][0-9])|30|31)$/;
//输出 true
console.log(pattern.test("1923-3-18"));
//输出 true
console.log(pattern.test("1923-4-31"));
//输出 true
console.log(pattern.test("1923-2-29"));
//输出 true
console.log(pattern.test("2016-2-29"));

上述正则验证还不完善,主要是2,4,6,9,11月份的天数问题。

2.4.2 通用日期正则

//日期正则,复杂判定
var dP2 = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
//输出 true
console.log(dP2.test("2017-02-11"));
//输出 false
console.log(dP2.test("2017-15-11"));
//输出 false
console.log(dP2.test("2017-02-29"));

2.5 Email正则

2.5.1 基本Email正则

var pattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
//输出 true
console.log(pattern.test('cn30ke@163.com'));
//输出 true
console.log(pattern.test('ifat3@sina.com.cn'));
//输出 true
console.log(pattern.test('ifat3.it@163.com'));
//输出 true
console.log(pattern.test('ifat3_-.@30ke.cn'));
//输出 false
console.log(pattern.test('ifat3@30ke.online'));
//输出 false
console.log(pattern.test('毛瑞@30ke.cn'));

基本Email正则是最常用的验证方式,也适合大多数的应用场景。从以上测试可以看出,该表达式不支持.online及.store结尾的域名。如需兼容这类域名(大于4位),调整正则结尾{2,4}的限制部分即可(例:{2,8})。另一个问题是Email用户名不能包括中文。

2.5.2 中文名Email正则

根据前一正则中的问题,追加两条规则如下:

用户名可以包括中文 [\u4e00-\u9fa5]
域名结尾最长可为8位 {2,8}

var pattern = /^([A-Za-z0-9_\-\.\u4e00-\u9fa5])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,8})$/;
//输出 true
console.log(pattern.test('cn30ke@163.com'));
//输出 true
console.log(pattern.test('ifat3@sina.com.cn'));
//输出 true
console.log(pattern.test('ifat3.it@163.com'));
//输出 true
console.log(pattern.test('ifat3_-.@30ke.cn'));
//输出 true
console.log(pattern.test('ifat3@30ke.online'));
//输出 true
console.log(pattern.test('毛瑞@30ke.cn'));

2.5.3 特定域名Email正则

在手机验证码出现之前,差不多邮箱验证是保证用户唯一性的唯一条件。而临时邮箱(也称10分钟邮箱或一次性邮箱)的出现,则使得邮箱验证及帐户激活这种机制失去了意义。而临时邮箱的地址是不可枚举的,我们只能才采取白名单的方式,只允许有限的邮箱域名通过验证。

var pattern = /^([A-Za-z0-9_\-\.])+\@(163.com|qq.com|30ke.cn)$/;
//输出 true
console.log(pattern.test('cn30ke@163.com'));
//输出 false
console.log(pattern.test('ifat3@sina.com.cn'));
//输出 true
console.log(pattern.test('ifat3.it@163.com'));
//输出 true
console.log(pattern.test('ifat3_-.@30ke.cn'));
//输出 false
console.log(pattern.test('ifat3@30ke.online'));
//输出 false
console.log(pattern.test('毛瑞@30ke.cn'));

此方法虽然能保证验证安全性,但是如果白名单太长会造成模式字符串太长。这时可以将邮箱域名白名单写成数组,利用正则表达式做初步验证,用白名单做域名的二次验证。

常用域名白名单数组:

var domains= ["qq.com","163.com","vip.163.com","263.net","yeah.net","sohu.com","sina.cn","sina.com","eyou.com","gmail.com","hotmail.com"];

上述白名单只列举了常用的11种邮箱域名,大家可以根据需要适当补充或删减。

2.6 手机号码正则

//手机号正则
var mPattern = /^((13[0-9])|(14[5|7])|(15([0-3]|[5-9]))|(18[0,5-9]))\d{8}$/;
//输出 true
console.log(mPattern.test("18600000000"));

2.7 身份证号正则

//身份证号(18位)正则
var cP = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
//输出 true
console.log(cP.test("11010519880605371X"));

上述正则只能对身份证号进行基本的通过性判定,关于公民身份号码判定的更多内容可参见文档:公民身份号码正确性判定及程序实现

2.8 URL正则

//URL正则
var urlP= /^((https?|ftp|file):\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/;
//输出 true
console.log(urlP.test(http://30ke.cn));

2.9 IP地址

2.9.1 IPv4地址正则

//ipv4地址正则
var ipP = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
//输出 true
console.log(ipP.test("115.28.47.26"));

2.9.2 IPv6地址正则

//IPV6正则
var pattern = /(([0-9a-fA-F]{1,4}:){7,7}[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,7}:|([0-9a-fA-F]{1,4}:){1,6}:[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,5}(:[0-9a-fA-F]{1,4}){1,2}|([0-9a-fA-F]{1,4}:){1,4}(:[0-9a-fA-F]{1,4}){1,3}|([0-9a-fA-F]{1,4}:){1,3}(:[0-9a-fA-F]{1,4}){1,4}|([0-9a-fA-F]{1,4}:){1,2}(:[0-9a-fA-F]{1,4}){1,5}|[0-9a-fA-F]{1,4}:((:[0-9a-fA-F]{1,4}){1,6})|:((:[0-9a-fA-F]{1,4}){1,7}|:)|fe80:(:[0-9a-fA-F]{0,4}){0,4}%[0-9a-zA-Z]{1,}|::(ffff(:0{1,4}){0,1}:){0,1}((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])|([0-9a-fA-F]{1,4}:){1,4}:((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9]))/;
//输出 true
console.log(pattern.test("fe80:0000:0000:0000:0204:61ff:fe9d:f156"));

2.10 十六进制颜色正则

//RGB Hex颜色正则
var cPattern = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/;
//输出 true
console.log(cPattern.test("#b8b8b8"));

2.11 QQ号码正则

//QQ号正则,5至11位
var qqPattern = /^[1-9][0-9]{4,10}$/;
//输出 true
console.log(qqPattern.test("65974040"));

2.12 微信号正则

//微信号正则,6至20位,以字母开头,字母,数字,减号,下划线
var wxPattern = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/;
//输出 true
console.log(wxPattern.test("RuilongMao"));

2.13 车牌号正则

//车牌号正则
var cPattern = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
//输出 true
console.log(cPattern.test("京K39006"));

2.14 包含中文正则

//包含中文正则
var cnPattern = /[\u4E00-\u9FA5]/;
//输出 true
console.log(cnPattern.test("30课"));

总结

以上所述是小编给大家介绍的常用JavaScript正则表达式汇编与示例详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

(0)

相关推荐

  • js正则表达式校验指定字符串的方法

    最新一个小表单验证需求:"只能输入汉字,并且必须包含"支行","分行","银行","信用社""字样,需用正则表达式校验 故写出了如下的表达式 var patt1=new RegExp(/^[\u0391-\uFFE5]*(([\u652f]{1}[\u884c]{1})|([\u5206]{1}[\u884c]{1})|([\u94f6]{1}[\u884c]{1})|([\u4fe1]{1}[\u7528

  • JS中验证整数和小数的正则表达式

    验证整数和小数的正则表达式 网上很多关于验证小数的正则表达式,但是很多都不是百分百正确,所以我结合一些前辈的经验,自己写了一个. 验证非0开头的无限位整数和小数.整数支持无限位,小数点前支持无限位,小数点后最多保留两位. js代码如下: var reg = /^(([^0][0-9]+|0)\.([0-9]{1,2})$)|^([^0][0-9]+|0)$/; 单独拆分: 1. 整数:/^([^0][0-9]+|0)$/ 2. 小数:/^(([^0][0-9]+|0)\.([0-9]{1,2})

  • JS 正则表达式从地址中提取省市县

    直接上代码,一看就懂, 一般国内地址返回Array前三项就是省市县,若要扩展到社区.街道等可自行扩展. var add1 = '四川省成都市都江堰市天马镇34号'; var add2 = '北京市北京市东城区前门大街1号' var add3 = '新疆维吾尔自治区乌鲁木齐市天山区中山路479号'; var add4 = '四川省成都市双流县幸福社区23号'; var add5 = '香港特别行政区中西区尖沙嘴路'; var reg = /.+?(省|市|自治区|自治州|县|区)/g; conso

  • JS正则表达式获取指定字符之后指定字符之前的字符串(推荐)

    一个常见的场景,获取:标签背景图片链接: 如字符串:var bgImg = "url (\"https://img30.360buyimg.com/sku/jfs/t26203/262/100869187/204098/1d1479e9/5b84b80bNf39db45f.jpg\")"; 脚本: var backgroundImageRegex=/(?<=url\(").+(?="\))/; var matchResult=bgImg.m

  • JavaScript 正则表达式与字符串查找方法

    首先提出一个问题: 如何取得一个给定的字符串substr在另一个字符串str中出现的次数? 字符串匹配,第一想到的就是正则表达式,但我们最常使用的字面量来创建的正则表达式方式却无法传入变量, 这时应该使用另一种创建正则表达式的方式:构造函数,如下 var reg = new RegExp(substr, "g"); 其中第一个参数表示要匹配的字符串模式,因此可以传入变量,不需要加/ /,第二个参数是可选的标志字符串. 可以传入变量了,再介绍个字符串基本包装类型的方法:match() 语

  • js正则表达式 匹配两个特定字符间的内容示例

    1.js截取两个字符串之间的内容: var str = "aaabbbcccdddeeefff"; str = str.match(/aaa(\S*)fff/)[1]; alert(str);//结果bbbcccdddeee 2.js截取某个字符串前面的内容: var str = "aaabbbcccdddeeefff"; tr = str.match(/(\S*)fff/)[1]; alert(str);//结果aaabbbcccddd 3.js截取某个字符串后面

  • Js中使用正则表达式验证输入是否有特殊字符

    Js中使用正则表达式验证输入是否有特殊字符的代码如下所示: //验证是否有特殊字符 function checkval(t) { var re = /^[\u4e00-\u9fa5a-z]+$/gi;//只能输入汉字和英文字母 if (re.test(t)) { return true; } else { return false; } }  js正则表达式,验证同一字符串不同 var num = 888; var reg = /^[1-9]{1}[0-9]*$/g; console.log(r

  • JS正则表达式常见用法实例详解

    本文实例讲述了JS正则表达式常见用法.分享给大家供大家参考,具体如下: 前言:正则表达式(regular expression)反反复复学了多次,学了又忘,忘了又学,这次打算把基本的东西都整理出来,加强记忆,也方便下次查询. 学习正则表达式之前首先需要掌握记忆这些基本概念: 1.元字符:(.,\w,\W,\d,\D,\s,/S,^,$,) 字符 含义 . 匹配除了换行符以外的任意字符. \s 代表任意空白符(换行符,制表符,空格) \S 匹配任意非空字符串 \b 匹配单词边界,匹配单词的开头和结

  • 常用JavaScript正则表达式汇编与示例详解

    1.1 前言 目前收集整理了21个常用的javaScript正则表达式,其中包括用户名.密码强度.整数.数字.电子邮件地址(Email).手机号码.身份证号.URL地址. IP地址. 十六进制颜色. 日期. 微信号.车牌号.中文正则等.表单验证处理必备,赶紧收藏吧! 还会陆续加入新的正则进来,大家多提宝贵意见! 2.1 用户名正则 2.1.1 基本用户名正则 在做用户注册时,都会用到用户名正则校验. 定义基本用户名命名规则如下: 最短4位,最长16位 {4,16} 可以包含小写大母 [a-z]

  • javascript 正则表达式分组、断言详解

     javascript 正则表达式分组.断言详解 提示:阅读本文需要有一定的正则表达式基础. 正则表达式中的断言,作为高级应用出现,倒不是因为它有多难,而是概念比较抽象,不容易理解而已,今天就让小菜通俗的讲解一下. 如果不用断言,以往用过的那些表达式,仅仅能获取到有规律的字符串,而不能获取无规律的字符串. 举个例子,比如html源码中有<title>xxx</title>标签,用以前的知识,我们只能确定源码中的<title>和</title>是固定不变的.因

  • javascrip高级前端开发常用的几个API示例详解

    目录 MutationObserver API 特点 IntersectionObserver API 举个例子 图片懒加载 无限滚动 getComputedStyle() API 与style的异同 getBoundingClientRect API 应用场景 1.获取 dom 元素相对于网页左上角定位的距离 2.判断元素是否在可视区域内 MutationObserver MutationObserver 是一个可以监听 DOM 结构变化的接口. 当 DOM 对象树发生任何变动时,Mutati

  • JavaScript函数封装的示例详解

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,

  • Flutter常用的布局和事件示例详解

    Flutter 项目中常用的布局详情,及封装和使用,快速开发项目. 以及手势事件和滚动事件的使用 Scaffold 导航栏的实现,有些路由页可能会有抽屉菜单(Drawer)以及底部Tab导航菜单等 const Scaffold({ Key key, this.appBar,//标题栏 this.body,//内容 this.floatingActionButton,//悬浮按钮 this.persistentFooterButtons,//底部持久化现实按钮 this.drawer,//侧滑菜单

  • JavaScript中的FileReader示例详解

    目录 前言: input:file FileReader 补充:一个比较全面的例子 总结 前言: FileReader是一种异步文件读取机制,结合input:file可以很方便的读取本地文件. input:file 在介绍FileReader之前,先简单介绍input的file类型. <input type="file" id="file"> input的file类型会渲染为一个按钮和一段文字.点击按钮可打开文件选择窗口,文字表示对文件的描述(大部分情况

  • JavaScript表单验证示例详解

    HTML表单(form)通常用于收集用户信息,例如姓名,电子邮件地址,位置,年龄等. 但是很可能某些用户可能不会输入您期望的数据.HTML表单验证可以通过JavaScript完成. 为了避免对服务器资源造成不必要的压力,您可以使用JavaScript在客户端(用户系统)上验证表单数据,不正确的信息是不会提交给后台服务器的--这是所谓客户端验证.本文将介绍这种验证 表单验证一般分为两种方式. 客户端验证:直接在客户端执行JS进行验证,验证的过程中和服务器端没有任何的交互 服务器端验证:页面将验证信

  • JavaScript正则表达式的分组匹配详解

    分组 下面的正则表达式可以匹配kidkidkid: /kidkidkid/ 而另一种更优雅的写法是: /(kid){3}/ 这里由圆括号包裹的一个小整体称为分组. 候选 一个分组中,可以有多个候选表达式,用|分隔: var reg = /I love (him|her|it)/; reg.test('I love him') // true reg.test('I love her') // true reg.test('I love it') // true reg.test('I love

  • 如何检测JavaScript中的死循环示例详解

    前言 如果我们需要执行用户写的代码,如和避免死循环?我们最近遇到了这个问题,因为写错代码很常见,所以我们进行了一下尝试. 首先我们需要使用iframe 这主要是安全考虑,我们需要一个sandbox环境来执行JavaScript,避免影响到整体.iframe的sandbox属性可以用来禁止弹窗等等,非常有用. 地址可以选择Blob url,不过blob url会持有当前web page的origin,如果用户拷贝一些乱七八糟的代码不小心执行的话,会有安全问题.所以最终决定用data URI. if

  • JavaScript正则表达式中g标志详解

    目录 缘起 解密过程 搜索引擎 源码层面 结论 缘起 有一天在思否社区看到有个问题,大致描述如下 const list = ['a', 'b', '-', 'c', 'd']; const reg = /[a-z]/g; const letters = list.filter(i => reg.test(i)); // letters === ['a', 'c']; // 如果正则不使用`g`标志可以得到所有的字母 // 为什么加入`g`之后就不可以了 对问题而言,遍历中的i就是一个字符,不需要

随机推荐