浅析JavaScript正则表达式

1.正则表达式的定义

  正则表达式是一个描述字符模式的对象。JavaScript的RegExp类表示正则表达式,String和RegExp都定义了方法,后者使用正则表达式进行强大的模式匹配和文本检索与替换功能,JavaScript的正则表达式语法是Perl5的正则表达式语法的大型子集javascript

1.直接量定义(perl风格,本人较习惯用直接量):var reg = /exp/attributesjava

  var pattern = /ccy$/;//匹配以ccy结尾的字符串;git

注:同一段代码所表示的正则表达式每次运行时直接量会转换成不一样的RegExp对象
2.RegExp对象定义(js风格):var reg = new RegExp(exp, attributes);正则表达式

  var pattern = new RegExp("ccy$");;//匹配以ccy结尾的字符串;npm

2.直接量字符

  正则表达式中的全部字母和数字都是按照字面含义进行匹配的。JavaScript正则表达式语法也支持非字母的字符匹配,这些字符须要经过反斜杠做为前缀进行转义。vim

字母和数字字符 自身
\o NUL字符
\t 制表符
\n 换行符
\v 垂直制表符
\f 换页符
\r 回车符
\xnn 由十六进制nn指定的拉丁字符
\uxxxx 由十六进制xxxx指定的Unicode字符
\cX 控制符^X

 demo:
/\n/.test('\nccy');//true 匹配 \nccy
/\n/.test('\\nccy');//false 不匹配 \ccy
/\n/.test('\\\nccy');//true 匹配 \\nccy
数组


3.字符匹配

字符 匹配
[...] 方括号内的任意字符
[^...] 不在方括号内的任意字符
. 除换行符和其余Unicode行终止符以外的任意字符
\w 任何ASCII字符组成的单词,等价于[a-zA-Z0-9]
\W 任何非ASCII字符组成的单词,等价于[^a-zA-Z0-9]
\s 任何Unicode空白符
\S 任何非Unicode空白符
\d 任何ASCII数字,等价于[0-9]
\D 任何非ASCII数字,等价于[^0-9]
[\b] 退格直接量

demo:浏览器

/\w\w\d\d\d/.test('lt666');//true 匹配两个字母或者数字加三个数字的字符串cookie


4.重复字符匹配

字符 匹配
{n,m} 前一项至少n次,但不超过m次
{n,} 前一项n次或者更屡次
{n} 前一项n次
? 前一项0次或者1次,等价于{0,1}
0 前一项至少1次或者更屡次,等价于{1,}
* 前一项0次或者更屡次,等价于{0,}

demo:app

/\d{4,9}/.test(1314);//true 匹配4到9个数字
//下面的例子稍微有点复杂,仔细分析也很简单
/\w{3}\s?\w{2,4}\s+javascript+\s+[^(]*/.test('ccy is javascript coder');//true 匹配3个字母或数字加0个或1个空格加2到4个字母或数字加至少1个空格加javascript加至少1个空格加0个或多个左反圆括号字符


重复匹配还种模式:非贪婪模式(尽量的少匹配),只需在待匹配的字符后跟随一个?

??、+?、*?、{1,5}?

/\d{4,9}/.exec(131414131);//131414131
/\d{4,9}?/.exec(131414131);//1314
下面这种状况贪婪和非贪婪是同样的效果
/c+y/.exec('ccy');//ccy
/c+?y/.exec('ccy');//ccy
这是由于正则表达式的模式匹配老是会寻找字符串中第一个可能匹配的位置


5.选择、分组和引用

javascript正则语法还包括指定选择项、子表达式分组和引用前一子表达式的特殊字符。

字符 含义
| 选择,匹配的是该符号左边的子表达式或者右边的子表达式
(…) 组合,将几个项组合为一个单元,这个单元可经过* + ? | 等符号加以修饰,并且记住和这个组合相匹配的字符串以供此后的引用使用
(?:...) 只组合,把项组合到一个单元,但不记忆与改组相匹配的字符
\n 和第n个分组第一次匹配的字符相匹配,组是圆括号中的子表达式(也多是嵌套的),组索引是从左到右的左括号数,(?: 形式的分组不编码

1.选择

字符 | 用于分隔供选择的字符,选择项的尝试匹配是从左至右,直到发现了匹配项。

注:若是左边的选择项匹配就会忽略右边的匹配项,即便它产生更好的匹配

2.组合引用

正则表达式中的圆括号 () 有多中做用:

a.一个是把单独的项组合成子表达式;

b.一个是在完整的模式中定义子模式;

c.容许在同一正则表达式的后部引用前面的子表达式,引用的是实例而非匹配模式。

注:perl风格的\n,RegExp对象则$n,以左圆括号为子表达式索引,从1开始

'AA Am 99'.match(/(\w)\1/g);//["AA","99"]

/(A+)((B|C|D)+)(E+)/.exec('ABCDE');//["ABCDE","A","BCD","D","E"];


6.指定匹配位置

正则表达式中匹配位置是一个难点

锚字符与断言

字符 含义
^ 匹配字符串的开头,在多行检索中匹配一行的开头
$ 匹配字符串的结尾,在多行检索中匹配一行的结尾
\b 匹配一个单词的边界,就是位于\w与\W之间的位置
\b 匹配非单词边界的位置
(?=x) 零宽度正先行断言。仅当子表达式 X 在 此位置的右侧匹配时才继续匹配。例如,/w+(?=/d) 与后跟数字的单词匹配,而不与该数字匹配。此构造不会回溯。
(?!=x) 零宽度负先行断言。仅当子表达式 X 不在 此位置的右侧匹配时才继续匹配。例如,例如,/w+(?!/d) 与后不跟数字的单词匹配,而不与该数字匹配 。
(?<=X) 零宽度正后发断言。仅当子表达式 X 在 此位置的左侧匹配时才继续匹配。例如,(?<=19)99 与跟在 19 后面的 99 的实例匹配。此构造不会回溯。
(?<!X) 零宽度负后发断言。仅当子表达式 X 不在此位置的左侧匹配时才继续匹配。例如,(?<!19)99 与不跟在 19 后面的 99 的实例匹配

demo:

要匹配<title>javascript</title>中的javascript,此时用断言最合适

/(?<=<title>).*(?=<\/title>)/.exec('<title>javascript</title>');//javascript

(?<=<title>)零宽度正后发断言,断言<title>在当前位置左侧;

(?=<\/title>)零宽度正先行断言,断言</title>在当前位置的右侧,/ 须要加 \ 转义

细心体会一下


不用断言截取以下

'<title>javascript</title>'.match(/^<title>(.*)<\/title>$/)[1];//javascript


7.修饰符

字符 含义
I 不区分大小写
g 全局匹配
m 多行匹配模式

8.用于匹配模式的String方法

1.search(reg)

参数reg为正则表达式,返回第一个与之匹配的子串的起始位置,如找不到则返回-1
"javascript".search(/script/i); //4

注:search方法不支持全局检索,由于它会忽略正则表达式中的修饰符g

2.replace(reg,str)

用以执行检索与替换操做,注意出现$n则说明匹配子表达式
"javascript".replace(/javascript/gi,"JavaScript");

3.match(reg)

返回一个由匹配结果组成的数组,若是reg中设置了修饰符g,则返回的数组包含字符串中的全部匹配结果,若没有g,就不会进行全局检索,只会检索第一个匹配。
"1 plus 2 equals 3".match(/\d+/g); 返回["1","2","3"]

4.split(param)

参数能够为字符串也能够为正则表达式
"1,2,3,4,5".split(/,/);返回["1","2","3","4","5"]


咱们常常会匹配浏览器中cookie值

document.cookie="name=ccy;age=18";

/(^|;| )age=([^;]*)(;|$)/g.exec(document.cookie)[2];//18


9.RegExp对象

RegExp第一个参数包含正则表达式的主体部分,也就是直接量中两条斜线之间的文本,不管是字符串直接量仍是正则表达式都使用 \ 字符做为转义字符的前缀,
所以当给RegExp()传入一个字符串表述正则表达式时,必须将 \ 替换成 \\
第二个参数是可选的,只能传 g i m,或者它们的组合
var zipcode = new RegExp("\d{5}","g");

1.RegExp属性
source:是一个只读字符串,包含正则表达式的文本
global:是一个只读的布尔值,用以说明这个正则表达式是否带有修饰符g
ignoreCase:是一个只读的布尔值,用以说明正则表达式是否带有修饰符i
multiline:是一个只读的布尔值,用以说明正则表达式是否带有修饰符m
lastIndex:是一个可读/写的整数,若是匹配模式带有g修饰符,这个属性存储在整个字符串的下一次检索的开始位置,会被exec(),test()方法用到

2.RegExp方法exec()执行字符串的匹配检索,相似String.match(),都会返回一个数组test()当调用exec方法返回不为null则调用test方法返回为true

相关文章
相关标签/搜索