1、JavaScript 正则表达式上 基本语法定义JavaScript 种正则表达式有两种定义方式,定义一个匹配类似 的字符串1. 构造函数var reg=new RegExp(+%,g);2. 字面量var reg=/%/g; g: global,全文搜索,默认搜索到第一个结果接停止 i: ingore case,忽略大小写,默认大小写敏感 m: multiple lines,多行搜索元字符正则表达式让人望而却步以一个重要原因就是其转义字符太多了,组合非常之多,但是正则表达式的 元字符 (在正则表达式中具有特殊意义的专用字符,可以用来规定其前导字符)并不多元字符:( $ | ) ? * + .
2、并不是每个元字符都有其特定意义,在不同的组合中元字符有不同的意义,分类看一下预定义特殊字符字符 含义t 水平制表符字符类一般情况下正则表达式一个字符(转义字符算一个)对应字符串一个字符,表达式 abt的含义是r 回车符n 换行符f 换页符cX 与 X 对应的控制字符(Ctrl+X)v 垂直制表符0 空字符但是我们可以使用元字符来构建一个简单的类,所谓类是指,符合某些特征的对象,是一个泛指,而不是特指某个字符了,我们可以使用表达式 abc 把字符 a 或 b 或 c 归为一类,表达式可以匹配这类的字符元字符组合可以创建一个类,我们还可以使用元字符创建反向类/负向类,反向类的意思是不属于 XXX
3、类的内容,表达式 abc 表示不是字符 a 或 b 或 c 的内容范围类按照上面的说明要是我们希望匹配单个数字那么表达式是这样的0123456789如果是字母那么。,好麻烦,正则表达式还提供了范围类,我们可以使用 x-y 来连接两个字符表示从 x 到 y 的任意字符,这是个闭区间,也就是说包含 x 和 ybenshen,这样匹配小写字母就很简单了a-z要是想匹配所有字母呢?在组成的类内部是可以连写的,我们还可以这样写 a-zA-Z预定义类刚才使用正则我们创建了几个类,来表示数字,字母等,但这样写也很是麻烦,正则表达式为我们提供了几个常用的预定义类来匹配常见的字符字符 等价类 含义. nr 除了
4、回车符和换行符之外的所有字符d 0-9 数字字符D 0-9 非数字字符s tnx0Bfr 空白符S tnx0Bfr 非空白符w a-zA-Z_0-9 单词字符(字母、数字、下划线)W a-zA-Z_0-9 非单词字符有了这些预定义类,写一些正则就很方便了,比如我们希望匹配一个 ab+数字+任意字符 的字符串,就可以这样写了 abd.边界正则表达式还提供了几个常用的边界匹配字符字符 含义 以 xx 开头$ 以 xx 结尾b 单词边界,指a-zA-Z_0-9之外的字符B 非单词边界看个不负责任的邮箱正则匹配(切勿模仿,小括号后面会讲到) w+w+.(com)$量词之前我们介绍的方法都是一一匹配的,
5、如果我们希望匹配一个连续出现 20 次数字的字符串难道我们需要写成这样dddd.为此正则表达式引入了一些量词字符 含义? 出现零次或一次(最多出现一次)+ 出现一次或多次(至少出现一次)* 出现零次或多次(任意次)看几个使用量词的例子w+bByron 匹配 单词边界 Byron(/w+bByron).test(Hi Byron); /true (/w+bByron).test(Welcome Byron); /true (/w+bByron).test(Byron); /falsed+.d1,3 匹配三位小数的数字n 出现 n 次n,m 出现 n 到 m 次n, 至少出现 n 次,m 最多出现
6、 m 次贪婪模式与非贪婪模式看了上面介绍的量词,也许爱思考的同学会想到关于匹配原则的一些问题,比如3,5这个量词,要是在句子种出现了十次,那么他是每次匹配三个还是五个,反正 3、4 、5 都满足35 的条件,量词在默认下是尽可能多的匹配的,也就是大家常说的贪婪模式123456789.match(/d3,5/g); /“12345“, “6789“ 既然有贪婪模式,那么肯定会有非贪婪模式,让正则表达式尽可能少的匹配,也就是说一旦成功匹配不不再继续尝试,做法很简单,在量词后加上 ? 即可123456789.match(/d3,5?/g); /“123“, “456“, “789“分组有时候我们希望
7、使用量词的时候匹配多个字符,而不是像上面例子只是匹配一个,比如希望匹配 Byron 出现 20 次的字符串,我们如果写成 Byron20 的话匹配的是 Byron 出现20 次,怎么把 Byron 作为一个整体呢?使用()就可以达到次目的,我们称为分组(Byron)20如果希望匹配 Byron 或 Casper 出现 20 次该怎么办呢?可以使用字符 达到或的功效(Byron|Casper)20我们看到图中有个1 的东东,那是什么?使用分组的正则表达式会把匹配项也放到分组中,默认就是按数字编号分发的,各异根据编号获得捕获的分组内容,这个在一些希望具体操作第几个匹配项的函数中很有用(Byron)
8、.(ok)如果有分组嵌套的情况,外面的组的编号靠前(|%)t*)有时候我们不希望捕获某些分组,只需要在分组内加上 ?: 就可以了,着并不意味着该分组内容不属于正则表达式,只是不会给这个分组加编号了而已(?:Byron).(ok)其实在 C#等语言中分组还可以起名字,不过 JavaScript 不支持前瞻说的有些抽象,看个例子 good(?=Byron)(/good(?=Byron)/).exec(goodByron123); /good (/good(?=Byron)/).exec(goodCasper123); /null (/bad(?=Byron)/).exec(goodCasper12
9、3);/null通过上面例子可以看出 exp1(?=exp2) 表达式会匹配 exp1 表达式,但只有其后面内容是exp2 的时候才会匹配,也就是两个条件,exp1(?!exp2) 比较类似good(?!Byron)表达式 含义exp1(?=exp2) 匹配后面是 exp2 的 exp1exp1(?!exp2) 匹配后面不是 exp2 的 exp1(/good(?!Byron)/).exec(goodByron123); /null (/good(?!Byron)/).exec(goodCasper123); /good (/bad(?!Byron)/).exec(goodCasper123)
10、;/null参考 司徒正美 JavaScript 正则表达式篇博客 JavaScript 正则表达式上 基本语法介绍了 JavaScript 正则表达式的语法,有了这些基本知识,可以看看正则表达式在 JavaScript 的应用了,在一切开始之前,看看RegExp 实例的几个属性RegExp 实例对象有五个属性1. global:是否全局搜索,默认是 false2. ignoreCase:是否大小写敏感,默认是 false3. multiline:多行搜索,默认值是 false4. lastIndex:是当前表达式模式首次匹配内容中最后一个字符的下一个位置,每次正则表达式成功匹配时,lastI
11、ndex 属性值都会随之改变。5. source:正则表达式的文本字符串除了将正则表达式编译为内部格式从而使执行更快的 compile()方法,对象还有两个我们常用的方法regObj.test(strObj)方法用于测试字符串参数中是否存正则表达式模式,如果存在则返回 true,否则返回falsevar reg=/d+.d1,2$/g;reg.test(123.45); /true reg.test(0.2); /true reg.test(a.34); /false reg.test(34.5678); /falseregObj.exec(strObj)方法用于正则表达式模式在字符串中运行查
12、找,如果 exec() 找到了匹配的文本,则返回一个结果数组。否则,返回 null。除了数组元素和 length 属性之外,exec() 方法还返回两个属性。index 属性声明的是匹配文本的第一个字符的位置。input 属性则存放的是被检索的字符串 string。调用非全局的 RegExp 对象的 exec() 时,返回数组的第 0 个元素是与正则表达式相匹配的文本,第 1 个元素是与 RegExpObject 的第 1 个子表达式相匹配的文本(如果有的话),第 2 个元素是与 RegExp 对象的第 2 个子表达式相匹配的文本(如果有的话),以此类推。调用全局的 RegExp 对象的 ex
13、ec() 时,它会在 RegExp 实例的 lastIndex 属性指定的字符处开始检索字符串 string。当 exec() 找到了与表达式相匹配的文本时,在匹配后,它将把 RegExp 实例的 lastIndex 属性设置为匹配文本的最后一个字符的下一个位置。可以通过反复调用 exec() 方法来遍历字符串中的所有匹配文本。当 exec() 再也找不到匹配的文本时,它将返回 null,并把 lastIndex 属性重置为 0。var reg=/d/g; var r=reg.exec(a1b2c3); console.log(reg.lastIndex); /2 r=reg.exec(a1b
14、2c3);console.log(reg.lastIndex); /4两次执行 r 的结果var reg=/d/g; while(r=reg.exec(a1b2c3)console.log(r.index+:+r0);可以看到结果:1:13:25:3除了上面的两个方法,有些字符串函数可以传入 RegExp 对象作为参数,进行一些复杂的操作strObj.search(RegObj)search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。search() 方法不执行全局匹配,它将忽略标志 g。它同时忽略 regexp 的 lastIndex 属性,并且总是从字符串
15、的开始进行检索,这意味着它总是返回 stringObject 的第一个匹配的位置。a1b2c3.search(/d/g); /1 a1b2c3.search(/d/); /1strObj.match(RegObj)match() 方法将检索字符串 stringObject,以找到一个或多个与 regexp 匹配的文本。但 regexp 是否具有标志 g 对结果影响很大。如果 regexp 没有标志 g,那么 match() 方法就只能在 strObj 中执行一次匹配。如果没有找到任何匹配的文本, match() 将返回 null。否则,它将返回一个数组,其中存放了与它找到的匹配文本有关的信息。
16、该数组的第 0 个元素存放的是 匹配文本,而其余的元素存放的是与正则表达式的子表达式匹配的文本。除了这些常规的数组元素之外,返回的数组还含有两个对象属性。index 属性声明的是匹配文本的起始字符在 stringObject 中的位置,input 属性声明的是对 stringObject 的引用。var r=aaa123456.match(/d/); 如果 regexp 具有标志 g,则 match() 方法将执行全局检索,找到 strObj 中的所有匹配子字符串。若没有找到任何匹配的子串,则返回 null。如果找到了一个或多个匹配子串,则返回一个数组。不过全局匹配返回的数组的内容与前者大不相
17、同,它的数组元素中存放的是 strObj 中所有的匹配子串,而且也没有 index 属性或 input 属性。var r=aaa123456.match(/d/g);strObj.replace(regObj,replaceStr)关于 strng 对象的 replace 方法,我们最常用的时传入两个字符串的做法,但这种做法有个缺陷,只能 replace 一次abcabcabc.replace(bc,X); /aXabcabcreplace 方法的第一个参数还可以传入 RegExp 对象,传入正则表达式可以时 replace 方法更加强大灵活abcabcabc.replace(/bc/g,X)
18、; /aXaXaX abcaBcabC.replace(/bc/gi,X); /aXaXaX如果 replace 方法的第一个参数传入的是带分组的正则表达式,我们在第二个参数中可以使用$1.$9 来获取相应分组内容,比如希望把字符串 13489 的换为$#x#$,我们可以这样13489.replace(/g,#$1#); /“1#2#34#567#89“当然还有很多方式可以达到这一目的,这里只是演示一下利用分组内容,我们在第二个参数中使用 #$1#,其中$1 表示被捕获的分组内容,在一些 js 模板函数中可以经常见到这种方式替换字符串。strObj.replace(regObj,functio
19、n()可以通过修改 replace 方法的第二个参数,使 replace 更加强大,在前面的介绍中,只能把所有匹配替换为固定内容,但如果我希望把一个字符串中所有数字,都用小括号包起来该怎么弄2398rufdjg9w45hgiuerhg83ghvif.replace(/d+/g,function(r) return (+r+);); /“(2398)rufdjg(9)w(45)hgiuerhg(83)ghvif“把 replace 方法的第二个参数传入一个 function,这个 function 会在每次匹配替换的时候调用,算是个每次替换的回调函数,我们使用了回调函数的第一个参数,也就是匹配内
20、容,其实回调函数一共有四个参数1. 第一个参数很简单,是匹配字符串2. 第二个参数是正则表达式分组内容,没有分组则没有该参数3. 第三个参数是匹配项在字符串中的 index4. 第四个参数则是原字符串2398rufdjg9w45hgiuerhg83ghvif.replace(/d+/g,function(a,b,c)console.log(a+t+b+t+c); return (+a+);); 2398 0 2398rufdjg9w45hgiuerhg83ghvif 9 10 2398rufdjg9w45hgiuerhg83ghvif 45 12 2398rufdjg9w45hgiuerhg8
21、3ghvif 83 22 2398rufdjg9w45hgiuerhg83ghvif 这是没有分组的情况,打印出来的分别是 匹配内容、匹配项 index 和原字符串,看个有分组的例子,如果我们希望把一个字符串的外壳去掉, 变成 123.replace(/+)%/g,function(a,b,c,d)console.log(a+t+b+t+c+t+d); return b;) /123 1 0 2 5 3 10 根据这种参数 replace 可以实现很多强大的功能,尤其是在复杂的字符串替换语句中经常使用。strObj.split(regObj)我们经常使用 split 方法把字符串分割为字符数组a,b,c,d.split(,); /“a“, “b“, “c“, “d“和 replace 方法类似,在一些复杂的分割情况下我们可以使用正则表达式解决a1b2c3d.split(/d/); /“a“, “b“, “c“, “d“这样就可以按照数字分割字符串了,是不是很强大。看完这两篇博客基本就能对平时用到的 JavaScript 正则表达式游刃有余了。要求在前端把一个 div 中的英文段落单词首字母都换成大写,你是不是知道该怎么做了?