javascript正则表达式

正则表达式

作用

用来匹配符合某种规则的字符串

• 一般使用场景
• 检索字符串中符合某种规则的子字符串
• 判断用户的输入是否符合某种规则
• 替换字符串中符合某种规则的文本
• 用户端输入是否为合法的手机号/邮箱/用户名

一个简单的例子

let str = '蚂蚁竞走10年了'
console.log(/\d/.test(str))//字符串中有数字吗

正则表达式的创建

那么如何去创建一个正则表达式呢,一般有两种方法.

字面量方式创建’

• 简单,直观,非常实用
• 就像创建一个对象,一个数组一样

let reg = /\+86\d{11}/g

构造函数方式创建

• 麻烦,但是正则规则可以通过字符串拼接,有些场景不得不用.

let reg = new Regexp('+86\d{11}','g')//和上面的正则表达式效果相同

• 最后的g代表全局，还有几个修饰符:
• g：global，全文搜索，不添加的话搜索到第一个结果停止搜索
• i：ingorecase，忽略大小写，默认大小写敏感
• m：multiplelines，多行搜索

最简单用法

正则方法

let reg = /\+86\d{11}///设置规则,以+86开头的十一位数字
reg.test('+8617811111111')//是否含有符合正则表达式规则的字符串??

字符串方法

对于一个字符串,有以下几种函数

• .search()搜索字符串中的某个内容,返回它的下标
  

• .match()匹配字符串中的某个内容
  

• .replace()替换字符串中的某个内容
  

• .split()把一个字符串分割成字符串数组。
  

正则表达式的符号

在正则表达式中,有很多符号是有特殊意义的,因此如果需要匹配某些符号时,需要将其转义\

([{\^$|)?*+.//都是有意义的,单纯当做符号来使用需要转义`\`

举个例子

• 比如说,要查询一个字符串中有多少个.
  
• 并不能得到我们想要的结果,因此,正则表达式中的.需要转义,让其只发挥作为符号的作用
• 在通过.length,就可以得出总公有多少个.
  

字符串匹配

正则适合使用在比较模糊的场景

let reg = /gundam/
reg.test('gundam')

范围匹配

• [ ] 匹配一个
• [abcd]匹配一个字符,是abcd中的任意一个
  -[0-9]匹配到0-9的一个数字
• [a-zA-Z]匹配一个不限制大小写的字符
• [^abc]表示一个不是a或b或c的字符

let reg = /不要[0-9][0-9][89]/
reg.test('我们不要118')//true
reg.test('不要我们118')//false
reg.test('我们要118')//false
reg.test('我们不要999')//true

预定义匹配

什么是预定义匹配呢?就是一种固定的写法,代表一定的含义.

• .等价于[^/r/n],匹配一个除了回车或换行以外的任意字符
• \d等价于[0-9].匹配一个0-9的数字
• \D.等价于[^0-9]匹配一个不是0-9的字符
• \s等价于[空格\t\n\r\v\f]，匹配一个空白字符
• \S等价于[^空格\t\n\r\v\f],匹配一个不是空白字符的字符
• \w等价于[a-zA-Z_0-9]，匹配一个字母、数字、下划线
• \W等价于[^a-zA-Z_0-9]，匹配一个非单词字符

量词匹配

上面的[]匹配的是单独一个字符,而量词匹配的是0到多个

• ?前面的字符出现0次或者1次
• +前面的字符出现1次或者多次
• *前面的字符出现0次或者多次
• {n}前面的字符出现n次
• {n,m}前面的字符出现n到m次
• {n,}前面的字符出现至少n次

边界匹配

以…开头或者以…结尾

• /^xyz/以xyz开头
• /abc$/以abc为结尾
• /\babc\b/匹配是单词的abc(左右两侧是字符串开头、结尾、中横线、空格)
• /\Babc\B/`匹配 不是单词的abc

var str='hello1worldhello2123456djnjdnvjhello3'
str.match(/hello\d/g)//["hello1","hello2","hello3"]
str.match(/^hello\d/g)//["hello1"]
str.match(/hello\d$/g)//["hello3"]
var str2='hello1whello9orldhello212-hello8-3456ckndnknvfhello3'
str2.match(/\bhello\d\b/g)//["hello1","hello2","hello8","hello3"]
//注意-也用于区分单词边界

简单的案例

判断用户手机号是否符合规则

let reg = /^1\d{10}$/

判断用户的输入是否是合法用户名

• 规则：合法用户名至少8位至多15位，包含大写、小写、数字、下划线至少两种

functionvalidUsername(rawInput){
//如果不满足全部为字母数字下划线且长度为8~15返回false
if(!/^\w{8,15}$/.test(rawInput)) return false//如果只包含一种返回false
if(/(^[a-z]+$)|(^[A-Z]+$)|(^[0-9]+$)|(^_+$)/.test(rawInput)) return false 
return true
}

正则表达式的贪婪模式

什么是贪婪模式?

• 当设置了一个正则后,浏览器默认会尽可能多的去匹配
• 如果想使用非贪婪模式，可以再量词后加?即可
• 下图中,贪婪模式直接匹配第一个'直到最后一个',因此数组只有一个值,但是这个值非常长
• 而非贪婪模式匹配了多个'之间的单词
  

分组

什么是分组?

• 就是把一些字符作为整体
• 将字符串括号括起来,就可以当成一个整体,设置成一个分组()
• 下图中,使用()将<\/?和>包裹,分为两组,两组之间的div更换为span,自身不变.
  

前瞻

/hello(?=gundam)/.test('hellogundam')//true
/hello(?=gundam)/.test('helloWorld)//false
/hello(?!gundam)/.test('helloWorld')//true