脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-JS 学习笔记--7---正则表达式,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。 正则表达式中的内容很多,也很深,下面只是一些基本的知识点,练习中使用的浏览器是IE10,若有不当处请各位朋友指正,我会在第一时间修改错误之处。
匹配的概念:是包含的意思,不是相等的意思
1、正则表达式简介
在表单提交的时候需要用JS来对用户提交的数据进行验证,这样做的目的一是减少网络流量(尽可能的让提交到服务器端的数据时合法的,减少了客户端和服务器端数据交互),二是改善了用户的体验效果。
正则表达式可以在浏览器端进行数据验证的,也可以在服务器端用。当浏览器端数据验证通过以后,将数据提交到服务器端,服务器端还会有数据的验证和有效性处理,由于通过了客户端的验证,故可以节约大量的服务器端的系统资源。
正则表达式(regular exPression)是一个描述字符模式的对象,ECMAScript中的RegExp类来表示正则表达式,并且String和RgeExp都顶一个使用正则表达式进行强大的模式匹配和文本检索替换等函数,如果遇到复杂的数据测试就需要用到正则表达式,比如验证url地址、邮箱是否合法、从大量文本中提取有效信息等。
正则表达式在很多语言中都支持,而且实现方式也大体相同,元字符基本上是一样的,只是有些方法名可能不一样,正真的做到了跨语言的技术。 正则表达式的元字符见百度
2、正则表达式的创建
两种方法:new RegExp('...',[[i][m][g]]);和字面量方式 /.../[[i][m][g]];中括号表示可省
new方法的第一个参数是正则表达式的模式,后面第二个参数是从 igm 三个字母中选择任意字母组成的字符串[ig,im,gm,img 四种之一],称作为模式修饰符,并且模式修饰符的各个字符之间以及两边不能够有其他任何的字符,三个字母的书写顺序无所谓
字面量方式中两个反斜杠之内的值是正则表达式的模式,注意是不带引号的,如果写了引号则代表引号也是模式的组成成员,后面的模式修饰符和上面new方法一样,紧跟第二个反斜杠
模式修饰符的可选参数
参数 含义 结果
i 忽略大小写 如果不写,默认的是区分大小写的
g 全局匹配 如果不写,结果是只要匹配到一个就返回
m 多行匹配 如果不写,则只是匹配一行
3、测试正则表达式
RegExp 对象提供了两种测试方法test()和exec()方法,基本功能是相似的,用于测试字符串的匹配。test()方法在字符串中查找是否存在指定的正则表达式并返回布尔值,如果存在就返回true,不存在就返回false;exec()方法也是在字符中查找指定的正则表达式,如果执行成功,则返回包含该查找字符串的相关信息数组(和分组有关),如果执行失败,则返回null。
通过测试得知,test()方法方法是只要匹配一次成功就返回,然后第二次执行的时候从第一次匹配成功的字符串之后开始查找,具体的可以参考练习中RegExp对象属性测试lastIndex
使用方式:pattern.test(str); pattern.exec(str); 返回值可以用于if的条件
4、使用字符串的正则表达式方法
除了上面的test()和exec()方法外,还有几个比较常用的String对象提供的几个方法 注:这些方法都是操作的值,不会改变字符串的本身,因为字符串具有不可变性,如果正则表达式中没有注明进行全局匹配的话,都默认只是匹配一个就返回,但是seArch永远是匹配第一个就返回
String对象中的正则表达式方法
方法 含义 说明
str.match(pattern) 返回字符串str中复合模式pattern的子串或null 如果表达式没有设置成全局就只是返回第一个,设置成全局就按照数组返回所有
str.search(pattern) 返回字符串str中复合模式pattern的开始位置 从下标为0开始,查到就返回,没有全局之说,若没有找到就返回 -1
str.replace(pattern,replacement) 用replacement来替换字符串str中复合模式pattern的字符串 全部替换,返回替换后的字符串,源字符串不会被改变
str.splIT(pattern) 将字符串str按照模式pattern匹配后的子字符串进行分割 返回的是分割后的字符数组,源字符串不变
5、RegExp 对象中的静态属性
RegExp提供了一些静态属性,不需要声明对象就可以运行,但是不是所有浏览器都兼容
RegExp对象的静态属性
属性 短名 含义 备注
input $_ 当前被匹配的字符串,就是源字符串 opera不支持
lastMatch $& 最后一个被匹配的子字符串 OPEra不支持
leftContext $` 最后一次匹配的前子串
rightContext $' 最后一次匹配之后的子串 注意这个单引号前面要使用转义字符/
lastParen $+ 最后一对圆括号内的匹配子串 Opera不支持
multiline $* 用于指定是否所有表达式都用于多行的布尔值 IE、Opera不支持
在使用这些静态属性之前必须要先执行一次正则表达式【pattern.test(str)/pattern.exec(str)都可以,但是这两个执行都只是匹配一次就返回,所以可能有的效果不明显,可以多执行几次】,只有执行一次后使用这些静态属性才有结果,alert(RegExp.input)即可
使用短名和前面属性是一样的效果,短名使用是通过 RegExp['$_']等来操作,同时input这个静态属性比较特殊,可以通过RegExp.$_ 来使用,其它的短名均不可以这样使用。
1
2
3
4
5
6
7
var str="This Google is google ? Yes !";
alert(RegExp.input); //输出为空
pattern.test(str); //执行以下正则表达式 //其实这个测试是只要匹配一个就返回
alert(RegExp.input); //This Google is google ? Yes !
alert(RegExp['$_']); //This Google is google ? Yes !
alert(RegExp.$_); //This Google is google ? Yes !
6、RegExp中的对象属性
RegExp提供了一些对象的实例属性,这是针对具体的正则表达式的属性,使用的很少
RegExp 对象的实例属性
属性 含义 备注
global Boolean值,表示该正则表达式 g 是否已设置 设置为全局匹配返回为true,否则返回false
ignoreCase Boolean值,表示该正则表达式 i 是否已设置 设置为忽略大小写返回为true,否则返回为false
multiline Boolean值,表示该正则表达式 m 是否已设置 设置为多行匹配返回为true,否则返回为false
Source 正则表达式的源字符串形式 返回的就是字面量形式的反斜杠之内的字串,或者是new对象的第一个参数
lastIndex 整数,代表下次匹配将从哪里的字符位置开始(索引) 可以用多个test()执行,查看不同结果
注:lastIndex 在获取下次匹配位置上IE和其他的浏览器有偏差,主要表现在非全局匹配上,lastIndex 还支持手动赋值。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
var pattern =/Box/ig;
alert(pattern.global); // true 是否设置为全局匹配 表示 g 是否已经设置
alert(pattern.ignoreCase); // true 是否设置为忽略大小写 表示 i 是否已经设置
alert(pattern.multiline); // false 是否设置为多行匹配 表示 m 是否已经设置
alert(pattern.source); // Box 返回的是正则表达式的源字符串形式
var str = "box and Box and box";
//exec()一次只是匹配一条数据就返回
pattern.exec(str);
alert(pattern.lastIndex); //3 上一条语句执行后匹配了一个box从这后面开始的第一个字符串,下标为3
pattern.exec(str); //再执行一次 匹配第二个box 后面的字符的索引为11
alert(pattern.lastIndex); //11
pattern.lastIndex=13; //设置下一次开始匹配的起始位置
alert(pattern.lastIndex); //13
获取控件 一般简单的元字符的意思就不说明了 百度一大把
7、/b代表的是是否到达字符串的边界,和开始结尾标记符 ^,$ 有同样的含义;
| 或匹配符,带有分组的意思,分隔供选择的字符.这个模式符使用的时候要注意它两边的内容是二选一,有时要注意用括号将其括起来;例如: /ab|cd|ef/ 匹配的是字符串 "ab",或者是字符串 "cd",又或者 "ef".
{4,8}等这种用大括号阔气来的代表的是在这个大括号前面的分组或者某个字符匹配的次数
8、在模式中,用括号括起来的代表一个分组,分组的匹配模式是从外到里,从左到右进行匹配的。在模式中进行了分组,然后执行了一次正则表达式,就可以在后面使用匹配组里面的内容,用RegExp.$1可以直接输出第一个分组的内容,或者在字符串的替换方法str.replace()中可以直接用$1,$2等来表示分组对应的匹配子字符串,如str.replace(pattern,'A$1A'),就是直接在复合第一个分组的内容两边加上字母A;当多个分组的时候是从左到右依次用$1,$2,$3等来代表分组匹配的内容。
9、贪婪模式和非贪婪模式
贪婪模式:在保证整个模式匹配能够成功的情况下,有些表达式会尽可能多的匹配一些字符。
非贪婪模式:同样是在保证整个模式匹配成功的情况下,尽可能的少匹配字符。
贪 婪 惰 性
+ +?
? ??
* *?
{n} {n}?
{n,} {n,}?
{n,m} {n,m}?
有时如果要解决贪婪的问题,可能要开启全局匹配。
9、使用exec()方法,返回数组
上文中提到此方法是RegExp中提供的可以用来测试正则表达式的方法,如果成功会返回一个数组,而这个方法其实主要是针对在表达式中有分组的时候使用的。
这个方法返回的结果中,下标为0的元素就是匹配成功的整体字符串,从下标为1开始一直到后面,里面的内容是对应的每一个分组匹配的内容,也就是说下表为1的元素是模式中第一个分组匹配的结果,以此类推。第i个分组就对应的返回数组中下标为i的元素。
如果没有分组的时候返回的是整个匹配的字符串,也就是下标为0的字符串
10、捕获性分组和非捕获性分组
所谓的捕获性,我理解为就是需要返回分组所匹配的结果;
而非捕获性则是不需要返回匹配的结果,有的时候却又必须要用一个分组来表示,比如在一个字符串的某一个部分可以有几组值,会需要用或匹配符来分割,而或匹配符如果不括起来会把它左边及右边当成两个组,而不是我们希望的只是某一部分相或,那就必须要用括号把个或分组符所分割的所有内容给括到一个括号内,但是由于不需要返回这个值,故可以用一个非捕获性分组。
一般的分组都是捕获性分组,非捕获性分组就是在前括号后面添加一个 ?: 就OK var pattern=/(/d+)(?:[a-z]+)/;执行后第二个分组内容不会返回
11、分组嵌套 :在一层分组中再添加一层分组,括号的嵌套 p=/(b(a(c)))/
分组嵌套中返回的时候也是先返回整个匹配的字符串,然后返回最外层的匹配结果,然后第二层的匹配结果,依次类推,先外后里
分析的时候可以先将分析的本层分组里面的所有分组视为无,也就是分析外层的时候就去掉本层里面所有嵌套的括号。 比如上面的模式 p.exec("bac");//返回的数组结果为:bac,bac,ac,c
12、前瞻匹配
就是在模式的匹配时候,某些字符后面必须更上一些特定的内容才能够匹配成功,比如字符串 "google" 中规定模式 goo 后面必须是 gle 才能够匹配成功,否则不匹配成功,就用到前瞻匹配
用括号将gle括起来放在goo后面,并且前括号后面写上 ?= 就OK 如:/goo(?=gle)/ 这样匹配的结果就只能够是字符串 google
13、特殊字符的处理
在特殊字符(比如:. ? / [ ] * + 等)前面添加一个转义字符 /,使这些特殊字符失去特殊意义
14、换行匹配 主要是读取文本的时候,存在多行
模式一般都是针对一行,除非明确的在模式中添加了换行符,才会跨行匹配 如果要处理多行的数据,则需要开启多行模式并且还要开启全局匹配模式,否则只是匹配一次就会返回
15、常用的一些正则表达式 许多常用的正则表达式,百度一下,
觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!
以上是脚本宝典为你收集整理的javascript代码实例教程-JS 学习笔记--7---正则表达式全部内容,希望文章能够帮你解决javascript代码实例教程-JS 学习笔记--7---正则表达式所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。