前端不会正则表达式？一篇带你入门

1.什么是正则表达式

用来处理字符串的规则

• 只能处理字符串
• 它是一个规则：可以验证字符串是否符合某个规则（test）,也可以把字符串中符合规则的内容捕获到（exec / match…）

正则创建的两种方式

//=>字面量创建方式（两个斜杠之间包起来的，都是用来描述规则的元字符）
let reg1 = /\d+/;
//=>构造函数模式创建  两个参数：元字符字符串，修饰符字符串
let reg2 = new RegExp("\\d+");

一个简单的例子

let str = "goods day study";
let reg = /\d+/;
//=>xxx.test 用来验证是否符合规则
console.log(reg.test(str)) //=>false

//=>reg.exec(str)用来捕获字符串
str='2019-12-20'
console.log(reg.exec(str)) //=>["2019", index: 0, input: "2019-12-20", groups: undefined]

2.正则表达式的组成

正则表达式由两部分组成：元字符和修饰符

• 元字符：包括量词元字符和特殊元字符
• 修饰符：用于指定额外的匹配策略

1）元字符

量词元字符

设置出现的次数

*		零到多次
+ 		一到多次
？ 		零次或者一次
{n} 	出现n次（n：零或者正整数）
{n,} 	出现n到多次
{n,m} 	出现n到m次

特殊元字符

单个或者组合在一起代表特殊的含义

\ 		转义字符（普通字符到特殊字符，特殊字符到普通字符）
. 		除\n以外的任意字符
^ 		以哪一个元字符作为开始
$ 		以哪一个元字符作为结束
\n 		换行符
\d 		0~9之间的一个数字
\D 		非0~9之间的一个数字 （大小写意思相反）
\w 		数字、字母、下划线中的任意一个字符
\W		非数字、字母、下划线中的任意一个字符
\s 		一个空白字符（包含空格、制表符、换页符等）
\t 		一个制表符（一个TAB建：四个空格）
\b 		匹配一个单词的边界
x|y  	x或者y的一个字符
[xyz] 	x或者y或者z中的一个字符
[^xy] 	除了x或者y以外的任意字符
[a-z] 	指定a-z这个范围中的任意字符
[^A-Z] 	非a-z这个范围中的任意字符
()  	正则中的分组字符
(?:) 	只匹配不捕获 
(?=)	正向预查（必须是xxx才行）
(?!)	负向预查（必须不是xxx才行）

普通元字符

代表本身含义的

/aaa/	  匹配的就是字符串“aaa” 

2）修饰符

常用的修饰符

i:ignoreCase	忽略单词大小写匹配
m:multiline		可以进行多次匹配
g:global		全局匹配

3.元字符详细解析

^ $

以哪一个元字符作为开始 以哪一个元字符作为结束

let reg=/^\d/	 //=>以数字开头
let reg=/\d$/	 //=>以数字结束
let reg=/\d+/ 	 //=>包含一到多个数字即可
let reg=/^\d+$/	 //=>只能是以一到多个数字

//验证手机号码（11位，第一个数字是1）
let reg = /^1\d{10}$/

\

转义字符（普通字符到特殊字符，特殊字符到普通字符）

let reg =/^2.3$/ 	//=>以2开头以3结尾中间加任意字符除了\n
let reg =/^2\.3$/	//=>只能是2.3 

let reg=/^\d$/; 	//=>只能是一个数字
let reg =/^\\d$/ 	//=匹配\d

x|y

x或者y的一个字符

let reg=/^(18|29)/  //=>只能是18或者29
let reg=/^(18)|(29)$/ //=>以18开头或者以29结尾

[]

中括号中的一个字符

//1.中括号中出现的字符一般代表本身的含义
let reg=/^[@+]$/ //=>只能是@或者+
console.log(reg.test("@")); //=>true
console.log(reg.test("+")); //=>true
console.log(reg.test("@+")); //=>false

let reg=/^[\d]$/ //=>\d在括号中还是代表0~9中的任意一个数字
console.log(reg.test("d")); //=>flase
console.log(reg.test("\\")); //=>flase
console.log(reg.test("9"));  //=>true

//2.中括号中不存在多位数
let reg=/^[18]$/ //=>只能是1或者8
console.log(reg.test("1")); //=>true
console.log(reg.test("8")); //=>true
console.log(reg.test("18")); //=>false

let reg = /^[10-29]$/ //=>1或者0到2或者9
console.log(reg.test("1")); //=>true
console.log(reg.test("9")); //=>true
console.log(reg.test("0")); //=>true
console.log(reg.test("2")); //=>true
console.log(reg.test("10")); //=>false

4.常用正则表达式

验证密码

//1.长度6-16位
//2.包含数字、字母、下划线
let reg=/^(\w|([#$@!%^&*+-/.])){6,16}$/

//包含字母大小写和数字组合6-16位
let reg=/(?!^[a-zA-Z]+$)(?!^[0-9]+$)(?!^[a-z0-9]+$)(?!^[A-Z0-9]+$)^(\w|([#$@!%^&*+-/.])){6,16}$/

//必须包含下划线 1-10位
reg=/(?=_)\w{1,10}/

验证邮箱

let reg=/^\w+((-\w+)|(\.\w))*@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/

url网址验证

let reg=/^(?:(http|https|ftp):\/\/)?((?:[\w-]+\.)+[a-z0-9]+)((?:\/[^/?#]*)+)?(\?[^#]+)?(#.+)?$/i