正则表达式

RegExp对象

Regular Experssion使用单个字符串来描述、匹配一系列符合某个句法规则的字符串

测试网站：https://regexper.com

创建方式

• 字面量

var reg = /\bis\b/g
"he is a boy".replace(reg,'IS')
//"he IS a boy"

• 构造函数

var reg = new RegExp('\\bis\\b','g');
"he is a boy".replace(reg,'IS')
//"he IS a boy"

元字符
正则表达式由两种基本字符类型组成：

• 原义文本字符

• 元字符

  • 元字符是在正则表达式中有特殊含义的非字母字符
  • * + ? $ ^ . | \ () {} []

字符类

一般情况下正则表达式一个字符对应字符串一个字符

表达式ab\t的含义是

我们也可以使用元字符[]来构建一个简单的类

所谓类是指符合某些特征的对象，一个泛指，而不是特指某个字符

表达式[abc]把字符a或b或c归为一类，表达式可以匹配这类的字符,

'a1b2c3d3'.replace(/[abc]/g,'X')
"X1X2X3d3"

字符串取反

• 使用元字符^创建反向类/负向类
• 反向类的意思是不属于某类的内容
• 表达式[^abc]表示不是字符a或b或c的内容

范围类

• 正则表达式还提供了范围类
• 可以用[a-z]来连接两个字符表示从a到z的任意字符
• 这是个闭区间，也就是包含a和z本身

'a1b2c3d4x5z6'.replace(/[a-z]/g,'X')
//"X1X2X3X4X5X6"

在[]组成的类内部是可以连写的[a-zA-Z]

'a1b2c3d4x5z6DSFDAFDAFD'.replace(/[a-zA-Z]/g,'X')
//"X1X2X3X4X5X6DSFDAFDAFD"

这种情况下如何匹配到'-'?只需要在后面补上一个'-'就行了

'a1b2-c-3d4x5z6DS-F-DAFDAFD'.replace(/[a-zA-Z-]/g,'X')
//"X1X2XXX3X4X5X6XXXXXXXXXXXX"

JS预定义类及边界

预定类:

"This is a boy".replace(/\Bis\b/,'0')
//"Th0 is a boy"

几个常用的边界匹配字符:

示例一：

"This is a boy".replace(/is/g,'0')
//"Th0 0 a boy"

只想替换第一个'is

"This is a boy".replace(/\Bis\b/,'0')
//"Th0 is a boy"

只想替换第二个

"This is a boy".replace(/\bis\b/g,'0')
//"This 0 a boy"

示例二：

"@123@345@".replace(/@./g,'Q')
//"Q23Q45@"

只想替换第一个

"@123@345@".replace(/^@./g,'Q')
//"Q23@345@"

只替换最后一个

"@123@345@".replace(/.@$/g,'Q')
//"@123@34Q"

var mulstr =  "@123   
               @456
               @678";
              
 mulStr.replace(/^@\d/gm,'x')
 // X123
    X456
    X678

量词

我们希望匹配一个连续出现20次数字的字符串：

显然不能用这中方式:\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d

?

+

*

JS正则贪婪模式与非贪婪模式

贪婪模式
正则表达式在匹配的时候会尽可能多的匹配，直到匹配失败

"12345678".replace(/\d{3,6}/g,'X')
//"X78"

//123456  -> X

非贪婪模式

• 让正则表达式尽可能少的匹配，也就是说一旦成功匹配不再继续尝试就是非贪婪模式
• 做法很简单，在量词后面加上?即可

"12345678".replace(/\d{3,6}?/g,'X')
//"XX78"

//123，456  ->  X,X

分组

()
匹配字符串Byron连续出现三次的场景，可能会用Byron{3}

并不能达到我们期待的结果，只会处理紧挨着的，

用()可以达到分组的功能，使量词作用域分组:

'a1b2c3d4'.replace(/[a-z]\d{3}/g,'X')
//"a1b2c3d4"

'a1b2c3d4'.replace(/([a-z]\d){3}/g,'X')
//"Xd4"

或

使用|达到效果

Byron|Casper

'ByronCasper'.replace(/Byron|Casper/g,'X')
// "XX"

'ByronsperByrCasper'.replace(/Byr(on|Ca)sper/g,'X')
//"XX"

反向引用

2015-12-25 --> 12/25/2015

'2015-12-25'.replace(/(\d{4})-(\d{2})-(\d{2})/g,'$2/$3/$1')
//"12/25/2015"

忽略分组

不希望捕获某些分组，只需要在分组内加上?:就可以

(?:Byron).(ok)

不让捕获分组

前瞻

• 正则表达式从文本头部向尾部开始解析，文本尾部方向
• 前瞻就是在正则表达式匹配到规则的时候，向前检查是否符合断言，后顾/后瞻方向相反
• javascript不支持后顾
• 符合和不符合特定断言称为肯定/正向匹配和否定/负向匹配

前瞻

'a2*3'.replace(/\w(?=\d)/g,'X')
//"X2*3"

JS对象属性

对象属性

• g:global全文搜索，不添加，搜索到第一个匹配停止
• i:ignore case忽略大小写，默认大小写敏感
• m:multiple lines多行搜索
• lastIndex:是当前表达式匹配内容的最后一个字符的下一个位置
• source:正则表达式的文本内容框

var reg1 = /\w/
var reg2 = /\w/gim

reg1.ignoreCase
//false

reg1.multiline
//false

reg1.global
//false

reg2.ignoreCase
//true
reg2.multiline
//true
reg2.global
//true

test和exec方法

test

RegExp.prototype.test(str)

• 用于测试字符串参数中是否存在匹配正则表达式模式的字符串
• 如果存在则返回true，不存在则返回false

var reg1 = /\w/
var reg2 = /\w/g

while(reg2.test('ab')){
  console.log(reg2.lastIndex)
}

//1
//2

exec

RegExp.prototype.exec(str)

• 使用正则表达式模式对字符串执行搜索，并将更新全局RegExp对象的属性以反映匹配结果

• 如果没有匹配的文本则返回null，否则返回一个结果数组

  • index声明匹配文本的第一个字符的位置
  • input存放被检索的字符串string

非全局调用

• 调用非全局的RegExp对象的exec()时，返回数组
• 第一个元素是与正则表达式相匹配的文本
• 第二个元素是与RegExpObject的第一个子表达式相匹配的文本(如果有的话)
• 第三个元素是与RegExp对象的第二个子表达式相匹配的文本(如果有的话)，以此类推

var reg3 = /\d(\w)(\w)\d/
var reg4 = /\d(\w)(\w)\d/g
var ts = '1az2bb3cy4dd5cc'

var ret = reg3.exec(ts)

console.log(reg3.lastIndex+'\t'+ret.index+'\t'+ret.toString())
//"0  0 1az2,a,z"
//非全局lastIndex不生效，reg3.lastIndex并未生效
console.log(reg3.lastIndex+'\t'+ret.index+'\t'+ret.toString())
//"0  0 1az2,a,z"

while(ret = reg4.exec(ts)){
  console.log(reg4.lastIndex+'\t'+ret.index+'\t'+ret.toString())
}
//"4  0 1az2,a,z"
//"10 6 3cy4,c,y"

字符串对象方法

String.prototype.search(reg)

• search()方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串
• 方法返回第一个匹配结果index，查找不到返回-1
• search()方法不执行全局匹配，它将忽略标志g，并且总是从字符串的开始进行检索

'dafd1afd'.search(/1/g)
//4
//输入数字也能匹配到，尝试往正则表达式转

String.prototype.match(reg)

• match()方法将检索字符串，以找到一个或多个与RegExp匹配的文本
• RegExp是否具有标志g对结果影响很大

非全局调用

• 如果没有RegExp没有标志g，那么match()方式就只能在字符串中执行一次匹配
• 如果没有找到任何匹配的文本，将返回null

• 找到了它将返回一个数组，其中存放了与它找到的匹配文本有关的信息

  • 返回数组的第一个元素存放的是匹配文本，而其余的元素存放的是与正则表达式的子表达式匹配的文本

  • 除了常规的数组元素之外，返回的数组还包含了两个对象属性

    • index声明匹配文本的起始字符，在字符串的位置
    • input声明，对stringObject的引用

var reg3 = /\d(\w)\d/
var reg4 = /\d(\w)\d/g
var ts = '$1a2b3c4d5e'


var ret = ts.match(reg3)
console.log(ret)
console.log(ret.index+'\t'+reg3.lastIndex)


//["1a2", "a", index: 1, input: "$1a2b3c4d5e", groups: undefined]
// 1    0

全局调用

• 如果RegExp具有标志g则match()方法将执行全局检索，找到字符串中的所有匹配字符串

  • 没有找到任何匹配的字符串，则返回null
  • 如果找到了一个或多个匹配字符串，则返回一个数组
• 数组元素中存放的是字符串中所有的匹配子串，而且也没有index属性或input属性

var reg3 = /\d(\w)\d/
var reg4 = /\d(\w)\d/g
var ts = '$1a2b3c4d5e'


var ret = ts.match(reg4)
console.log(ret)
console.log(ret.index+'\t'+reg4.lastIndex)


//["1a2", "3c4"]
//undefined    0

String.prototype.split(reg)

• 我们经常使用split方法将字符串分割为字符数组

'a,b,c,d'.split(',') //["a","b","c","d"]

• 在一些复杂的分割情况下我们可以使用正则表达式解决

'a1b2c3d'.split(/\d/);
//["a", "b", "c", "d"]

'a1.b|2c3d'.split(/\.|\|/);

//["a1", "b", "2c3d"]

String.prototype.replace()

• String.prototype.replace(str,replaceStr)

'a1b1c1'.replace('1',2)
//"a2b1c1"

• String.prototype.replace(reg,replaceStr)

'a1b1c1'.replace(/1/,2)
//"a2b1c1"

• String.prototype.replace(reg,function)

function会在每次匹配替换的时候调用，有四个参数

• 1、匹配字符串
• 2、正则表达式分组内容，没有分组则没有该参数
• 3、匹配项在字符串中的index
• 4、原字符串

'a1b2c3d4'  => 'a2b3c4d5'

'a1b2c3d4e5'.replace(/\d/g,function(match,index,origin){
    console.log(index)
    return parseInt(match) + 1
})
// 1
//3
//5
//7
//9
//"a2b3c4d5e6"

'a1b2c3d4e5'.replace(/(\d)(\w)(\d)/g,function(match,group1,group2,group3,index,origin){
    console.log(index)
    return parseInt(group1)+parseInt(group3)
})
// 1
//5
//"a3c7e5"