JavaScript正则

1.正则

1.什么是正则？

正则就是一个规则，用来处理字符串的规则

1、正则匹配

编写一个规则，验证某个字符串是否符合这个规则，正则匹配使用的是 test 方法

2、正则捕获

编写一个规则，在一个字符串中把符合规则的内容都获取到，正则捕获使用的方法：正则的exec方法、字符串中的split、replace、match等方法都支持正则

var reg = /^$/; //=>两个斜杠中间包含一些内容就是正则，两个斜杠之间包含的全部内容都是元字符

2.正则的元字符和修饰符

任何一个正则都是由 元字符 和 修饰符 组成的

1.修饰符

g(global)：全局匹配
i(ignoreCase)：忽略大小写匹配
m(multiline)：多行匹配

2.元字符

[量词元字符]
+：让前面的元字符出现一到多次
?：出现零到一次
*：出现零到多次
{n}：出现n次
{n,}：出现n到多次
{n,m}：出现n到m次

3.特殊意义的元字符

\：转义字符（把一个普通字符转变为有特殊意义的字符，或者把一个有意义字符转换为普通的字符）
.：除了\n（换行符）以外的任意字符
\d：匹配一个0~9之间的数字
\D：匹配任意一个非0~9之间的数字（大写字母和小写字母的组合正好是反向的）
\w：匹配一个 0~9或字母或_ 之间的字符
\s：匹配一个任意空白字符
\b：匹配一个边界符
x|y：匹配x或者y中的一个
[a-z]：匹配a-z中的任意一个字符
[^a-z]：和上面的相反，匹配任意一个非a-z的字符
[xyz]：匹配x或者y或者z中的一个字符
[^xyz]：匹配除了xyz以外的任意字符
()：正则的小分组，匹配一个小分组（小分组可以理解为大正则中的一个小正则）
^：以某一个元字符开始
$：以某一个元字符结束
?:：只匹配不捕获
?=：正向预查
?!：负向预查
……

除了以上特殊元字符和量词元字符，其余的都叫做普通元字符：代表本身意义的元字符

4.元字符详细解读

1.^ $

var reg = /\d+/; //=>包含某某某即可，这里说明包含1到多个数字即可
var str = '哈喽2017你好2018';
reg.test(str) =>true

reg=/^\d+/;
reg.test(str) =>false

reg=/^\d+$/;//=>只能是某某某的,这里说明只能是1到多个数字
reg.test('2017'); =>true
reg.test('2017哈喽2018'); =>false
reg.test('2'); =>true ^或者$只是一个修饰或者声明，不会占据字符串的位置

2.\

var reg = /^2.3$/;
reg.test('2.3'); =>true
reg.test('2+3'); =>true 点在正则中的意思：匹配除了\n以外的任意字符，而不是单纯的小数点

reg = /^2\.3$/;
reg.test('2.3'); =>true
reg.test('2+3'); =>false 使用转义字符把点转换为本身小数点的意思

3. x|y

var reg = /^18|19$/;//=>18 19 189 119 819 181 1819 ... 很多都符合这个规则

• 18或者19
• 以1开头 以9结尾 中间是8或者1
• 以18开头或者以19结尾即可 =>’18哈喽’ ‘哈喽19’…

var reg = /^(18|19)$/;//=>此时只有18或者19符合我们的规则了

3.分组()

1. 正则中的分组，也可以理解为一个大正则中的一个正则（包起来的部分是一个整体）；在正则中我们可以使用小括号改变一些默认的优先级；

2. 分组引用

3. 分组捕获

1.分组引用

\1 或者 \2 …出现和第N个分组一模一样的内容

var reg = /^([a-z])([a-z])\2([a-z])$/; //=> 符合的字符串：foot、book、week、attr、http...

\2这里是出现个

4.[ ]

[ ]应用场景：

[xyz] [^xyz] [a-z] [^a-z]

[ ]中的^是代表非的意思

[ ]中的-是区间的意思

4.1 \w：数组字母下划线中的任意一个字符

var reg = /^[a-zA-Z0-9_]$/; //=>等价于\w

4.2中括号中出现的元字符，一般都代表本身的含义

var reg = /^[.?+&]+$/; 

里面的四个元字符都是本身含义，例如：点就是小数点了，不是所谓的任意字符…

4.3 例：

1.描述样式类名的规则（数字、字母、下划线、-），并且不能以-开头 减号

//var reg = /^[\w-]+$/;
//var reg = /^[0-9a-zA-Z_-]+$/; //=>没有处理以-开头的情况
var reg = /^\w[\w-]*$/;

2.验证18~65之间的年龄

var reg = /^[18-65]$/; //不符合

1或者8~6或者5中的任意一个字符,中括号中出现的18不是数字18，而是1或者8，当前正则是非法的：因为不能设置8~6这种范围

分三个阶段处理：

1. 18 或者 19 /(18|19)/
2. 20 ~ 59 /([2-5]\d)/
3. 60 ~ 65 /(6[0-5])/

var reg = /^((18|19)|([2-5]\d)|(6[0-5]))$/;

2.常用的正则表达式编写

1.验证是否为有效数字

• 可能是正数，可能是负数 12 -12
• 整数或者小数 0 12 0.2 12.5 -12.3
• 只要出现小数点，后面至少要跟一位数字
• 小数点前面必须有数字

var reg = /^-?(\d|([1-9]\d+))(\.\d+)?$/;

• -? 负号可有可无
• (\d|([1-9]\d+))
• \d 一位数可以是任何值
• ([1-9]\d+) 多位数不能以零开头
• (.\d+)? 小数部分可有可无，有的话点后面必须跟一位数字

2.手机号码

• 11位数字
• 1开头

var reg = /^1\d{10}$/;

3.用户名：真实姓名

/^[\u4E00-\u9FA5]$/ 中文汉字的正则

var reg = /^[\u4E00-\u9FA5]{2,10}(·[\u4E00-\u9FA5]{2,10})?$/;

4.邮箱

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

• 以数字字母下划线开头
• @前面可以是 数字、字母、下划线、-、. 这些符号
• 不能把 -和. 连续出现，出现一次后面必须跟数字字母下划线
• @后面的部分支持
• 企业邮箱
• .com.cn 多域名情况

// [A-Za-z0-9]+
// ((\.|-)[A-Za-z0-9]+)*
// \.[A-Za-z0-9]+
// @163.com.cn
// @zhu-feng-pei-xun.com.cn

5.身份证号码

• 18位
• 前17位必须是数字
• 最后一位可以是数字或者X(X代表数字10)
• 
  
  • 130828199012040617
• 前六位：省市县 130828
• 接下来八位 出生年+月+日
• 倒数第二位数字 奇数代表男 偶数代表女

var reg = /^(\d{6})(\d{4})(\d{2})(\d{2})\d{2}(\d)(\d|X)$/;

这样写不仅可以匹配，而且以后捕获的时候，不仅可以把大正则匹配的结果捕获到，里面每一个小分组(小正则)匹配的结果也可以单独的捕获到 “分组捕获”

1. 年 1950~2017
2. 第一段 1950~1999
3. 第二段 2000~2017
4. 00~09
5. 10~17
6. /^((19[5-9]\d)|(20((0\d)|(1[0-7]))))$/

3.正则捕获

把当前字符串中符合正则的字符捕获到
RegExp.prototype：exec 实现正则捕获的方法

var str = '哈喽你好2017扬帆起航2018';
var reg = /\d+/;

reg.exec(str);

结果：

0: "2017"
index: 4
input: "哈喽你好2017扬帆起航2018"
length: 1

1.正则捕获的原理：

1、先去验证当前字符串和正则是否匹配，如果不匹配返回的结果是null（没有捕获到任何的内容）
2、如果匹配，从字符串最左边开始，向右查找到匹配的内容，并且把匹配的内容返回

exec捕获到结果的格式：

• 获取的结果是一个数组
• 数组中的第一项是当前本次大正则在字符串中匹配到的结果
• index：记录了当前本次捕获到结果的起始索引

• input：当前正则操作的原始字符串

• 如果当前正则中有分组，获取的数组中，从第二项开始都是每个小分组，本次匹配到的结果（通过exec可以把分组中的内容捕获到）

• 执行一次exec只能把符合正则规则条件中的一个内容捕获都，如果还有其它符合规则的，需要在次执行exec才有可能捕获到

2.正则捕获存在懒惰性

执行一次exec捕获到第一个符合规则的内容，第二次执行exec，捕获到的依然是第一个匹配的内容，后面匹配的内容不管执行多少次exec都无法捕获到

解决正则捕获的懒惰性：
在正则的末尾加修饰符g（全局匹配）

2.1正则为什么会存在懒惰性?

• 正则本身有一个属性：lastIndex（下一次正则在字符串中匹配查找的开始索引）
• 默认值：0，从字符串第一个字符开始查找匹配的内容
• 默认不管指定多少遍exec方法,正则的lastIndex值都不会变（也就是第二次以后查找的时候还是从第一个字符找，所以找到的结果永远都是第一个匹配的内容）
• 而且当我们手动把 lastIndex 进行修改的时候，不会起到任何的作用

2.2为什么加修饰符g就解决了懒惰性?

• 加了修饰符g，每一次exec结束后，浏览器默认会把lastIndex值进行修改，下一次从上一次结束的位置开始查找，所以可以得到后面匹配的内容了

var reg = /\d+/g;
var str = '哈喽你好2017杨帆起航2018';
console.log(reg.lastIndex);//=>0
console.log(reg.exec(str)[0]);//=>'2017'
console.log(reg.lastIndex);//=>8
console.log(reg.exec(str)[0]);//=>'2018'
console.log(reg.lastIndex);//=>16
console.log(reg.exec(str));//=>null
console.log(reg.lastIndex);//=>0
console.log(reg.exec(str)[0]);//=>'2017'