浅析JavaScript正则表达式

1.正则表达式的定义

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

1.直接量定义(perl风格，本人较习惯用直接量)：var reg = /exp/attributes

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

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

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

2.直接量字符

　　正则表达式中的所有字母和数字都是按照字面含义进行匹配的。JavaScript正则表达式语法也支持非字母的字符匹配，这些字符需要通过反斜杠作为前缀进行转义。

字母和数字字符	自身
\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 匹配两个字母或者数字加三个数字的字符串

4.重复字符匹配

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

demo：

/\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

巴特西

浅析JavaScript正则表达式

1.正则表达式的定义

2.直接量字符

3.字符匹配

4.重复字符匹配

5.选择、分组和引用

6.指定匹配位置

7.修饰符

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

9.RegExp对象

最新文章

热门文章