实战JS正则表达式

-正则表达式是一种文本模式的匹配工具。

-文章导读:

    --1.正则对象的属性和方法

    --2.字符串对象的方法

    --3.使用正则表达式:

      ---3.1 给字符串加上千分符

      ---3.2 字符串中出现次数最多的字母

      ---3.3 在多行中使用正则表达式

      ---3.4 从url中提取子域名

      ---3.5 分割Unicode字符

      ---3.6 在location对象中使用正则

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------

[新建正则表达式]:

1 var  regexp = /aabb/g; //g可省
2 var  regexp = new Regexp("xyz","g"); //第二个参数可省

区别在于:

1.采用字面量的写法新建的正则表达式对象在代码编译时就会生成,是平常开发中常用的方式;

2.采用构造函数生成的正则对象要在代码运行时生成。

 [使用正则表达式]:

正则对象的方法是指这样使用的: RegExp对象.方法(字符串)

字符串对象的方法是这样使用:字符串.方法(RegExp对象)

一、 正则对象的属性和方法

1.1 正则对象的属性:

1 ignoreCase //返回一个布尔值表示正则对象是否设置了i修饰符,是一个只读属性
2 global //表示正则对象是否设置了g修饰符,返回布尔值
3 multiline //表示是否设置了m修饰符,返回一个布尔值
4 lastIndex //返回下一次开始搜索的位置,该属性可读写,但只在设置了g修饰符时有意义
5 source //返回正则表达式的字符串形式(不包括反斜杠),只读属性

这样用:

1  i  --执行忽略大小写的匹配
2  g  --执行全局匹配(可以查看所有的匹配而不是只找到第一个匹配后就停止)
3  m  --执行多行匹配

1.2 test方法

test方法返回布尔值,用来验证字符串是否符合某个模式。如果正则表达式带有g修饰符,则每一次test方法都从上一次匹配结束的位置开始匹配。

使用了g修饰符的正则对象,表示要记录搜索的位置,接着使用test方法,每次开始搜索的委会都是上一次匹配的后一个位置:

如果正则表达式是一个空字符串,则会匹配所有的字符串,但前提是使用new RegExp()的方式:

1.3 exec方法

exec()返回匹配的结果,匹配成功exec方法返回装有匹配结果的数组,匹配失败返回null:

如果正则表达式包含圆括号,则返回的数组会包括多个元素。首先是整个匹配成功的结果,后面是圆括号里匹配成功的结果,如果有多个圆括号,他们的匹配成功的结果都会成为数组元素:

对于调用exec方法后返回的数组具有以下两个属性:

1 input --整个原待匹配的字符串
2 index --整个模式匹配成功的开始位置

同样,给正则表达式加上g修饰符就可以多次使用exec方法,下一次搜索的位置从上一次成功匹配结束的位置开始。

如果正则对象是一个空字符串:

二、字符串对象的方法

1 match-----返回匹配的子字符串
2 search----搜索
3 replace---替换
4 split-----分割

2.1 match()方法

字符串对象的match方法与正则对象的exec方法比较类似:

但是如果正则表达式带有g修饰符,那么match方法与exec方法就有差别了:

可以看到match返回了所有成功匹配的结果,但是exec方法只返回了一个。

2.2 search方法

search方法返回匹配成功的位置在整个字符串中的索引,如果没有匹配成功任何字符则返回-1,search方法会自己忽略g修饰符。

2.3 replace方法

str.replace(‘搜索模式‘,‘替换的内容‘);

可以看到,如果正则表达式不带g修饰符,那么replace方法会替换第一个匹配成功的结果,如果加上了g修饰符,那么会替换所有匹配成功的值。

replace方法的第二个参数可以使用$符号,用来指代所要替换的内容:

1 $&-----指代匹配的字符串
2 $`-----匹配结果前面的文本
3 $‘-----匹配结果后面的文本
4 $n-----指代匹配成功的第n组内容,n从1开始
5 $$-----指代美元符号$

replace方法的第二个参数也可以是函数,用于将第一个参数匹配到的值替换为函数返回值。

同时,作为replace方法的第二个参数的函数也可以由多个参数。它的第一个参数是整个匹配的内容,第二个参数是组匹配(这时有多少个组匹配就有多少个参数),此外最后还可以添加两个参数,倒数第二个参数是扑捉到的内容在整个字符串中的位置,最后一个参数是原字符串。

2.4 split() 方法

split(‘字符串的分割正则’,‘返回数组的最大成员数’);返回分割后各部分组成的数组。

可以变换正则的匹配规则来分割字符串。

上面正则的匹配规则是以0或多个a来进行分割,如果加上括号则括号匹配的部分也就是分割规则也会作为数组成员返回。

三、使用正则表达式

正则表达式不仅灵活还很强大,用它能很简洁的实现很多实用的功能,下面简单列举一些:

3.1给字符串加千分符

1          function spli(str){
2              var re = /(?=(?!\b)(\d{3})+$)/g;
3              return str.replace(re,‘,‘);
4          }
5          console.log(spli(str));

其中的(?=exp)用来匹配exp前面的位置,(?!exp)匹配后面跟的不是exp的位置,他们都是零宽断言。

如果要是不用正则表达式的话,代码会多些:

 1          var str = ‘12345432‘;//->[]
 2          function spli(str){
 3             var iNum = str.length%3;//->0,1,2
 4             var prev = ‘‘;
 5             var arr = [];
 6             var iNow = 0;
 7             var tmp = ‘‘;
 8             //千分号是从后向前三位三位加的,所以把三位余出来的从前面提取到
 9             if(iNum !=0){
10                 prev = str.substring(0,iNum);
11                 arr.push(prev);
12             }
13             //取到多余部分后面的
14             str = str.substring(iNum);
15             for(var i=0;i<str.length;i++){
16                 iNow++;
17                 tmp += str[i];
18                 if(iNow==3 && tmp){
19                     //数组里面放的是三位的数
20                     arr.push(tmp);
21                     tmp = ‘‘;
22                     iNow = 0;
23                 }
24             }
25             return arr.join(‘,‘);
26          }
27          console.log(spli(str));

3.2字符串中出现次数最多的字符

 1         var str = ‘kkkkkkkaaakkkkkkaaaaasddd‘;
 2         function most(str){
 3              //排序,正则匹配子项
 4              var arr = str.split(‘‘);
 5              arr.sort();
 6              str = arr.join(‘‘);
 7             // \1匹配前面相同的,也就是说跟(\w)相同的
 8              var re = /(\w)\1+/g;
 9              var num = 0;
10              var value = ‘‘;
11              //这里的$0就是找到的重复的整体
12              str.replace(re,function($0,$1){
13                  //alert($0);
14                  if(num<$0.length){
15                   num = $0.length;
16                   value = $1;
17                  }
18              });
19              return ‘出现次数最多的字符是‘+value+‘出现了‘+num+‘次‘;
20         }
21         console.log(most(str));

其中\1代表分组1匹配的文本。

3.3 在多行中使用正则表达式

^符号用来匹配输入/字符串的开始。如果多行(multiline)标志被设为 true,该字符也会匹配一个断行(line break)符后的开始处。

3.4 从url中提取子域名

上面的正则匹配/开始的字符串匹配到第一个.就停止了,http://长度为7,所以用了substr(7)之后就会返回子域名了。

3.5 分割Unicode字符

通常用来匹配字符的\w和\W只会匹配基本的ACSCII字符,要匹配Unicode字符的话就要另做处理了:

3.6 在location对象中使用正则

这里有个我越看越晕的例子,额:

来自小胡子==。[玩转正则之highlight高亮]

四、其他

正则表达式的收集:

[常用的正则表达式收集]

[js常用正则表达式]

参考资料:

[RegExp MDN]

[玩转正则之highlight高亮]

这里我只是总结了正则表达式相关的方法和属性,强烈建议阅读:正则表达式30分钟入门教程    它教会你如何写正则表达式,再结合文章上面提到的方法,写着写着,正则就不是那么遥不可及了,非常实用喔。

时间: 2024-10-25 18:34:31

实战JS正则表达式的相关文章

JS正则表达式完整教程(略长)

JS正则表达式完整教程(略长) 引言 亲爱的读者朋友,如果你点开了这篇文章,说明你对正则很感兴趣. 想必你也了解正则的重要性,在我看来正则表达式是衡量程序员水平的一个侧面标准. 关于正则表达式的教程,网上也有很多,相信你也看了一些. 与之不同的是,本文的目的是希望所有认真读完的童鞋们,都有实质性的提高. 本文内容共有七章,用JavaScript语言完整地讨论了正则表达式的方方面面. 如果觉得文章某块儿没有说明白清楚,欢迎留言,能力范围之内,老姚必做详细解答. 具体章节如下: 引言 第一章 正则表

js正则表达式的match test exec replace函数

js正则表达式的方法:一种正则在前,一种正则在后: 使用: 1.exec var res = /\-[a-z]/g .exec("font-size"); console.log(res); 得到的结果: 所以返回的是一个数组,第一个为匹配值,第二个是匹配的位置,第三个是输入的数 2.test var res = /\-[a-z]/g .test("font-size");console.log(res); 返回为一个布尔值 3.match var res =(&q

JS 正则表达式否定匹配(正向前瞻)

引言:JS 正则表达式是 JS 学习过程中的一大难点,繁杂的匹配模式足以让人头大,不过其复杂性和其学习难度也赋予了它强大的功能.文章从 JS 正则表达式的正向前瞻说起,实现否定匹配的案例.本文适合有一定 JS 正则表达式基础的同学,如果对正则表达式并不了解,还需先学习基础再来观摩这门否定大法. 一.标签过滤需求 不知道大家在写JS有没有遇到过这样的情况,当你要处理一串字符串时,需要写一个正则表达式来匹配当中不是 XXX 的文本内容.听起来好像略有些奇怪,匹配不是 XXX 的内容,不是 XXX 我

JS正则表达式大全(整理详细且实用)

JS正则表达式大全(整理详细且实用).需要的朋友可以过来参考下,希望对大家有所帮助!! 正则表达式中的特殊字符 字符 含意 \ 做为转意,即通常在"\"后面的字符不按原来意义解释,如/b/匹配字符"b",当b前面加了反斜杆后/\b/,转意为匹配一个单词的边界. -或- 对正则表达式功能字符的还原,如"*"匹配它前面元字符0次或多次,/a*/将匹配a,aa,aaa,加了"\"后,/a\*/将只匹配"a*".

精通JS正则表达式(转)

精通JS正则表达式,讲的比较详细,学习正则表达式的朋友可以参考下. 正则表达式可以: •测试字符串的某个模式.例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个电话号码模式或一个信用卡号码模式.这称为数据有效性验证 •替换文本.可以在文档中使用一个正则表达式来标识特定文字,然后可以全部将其删除,或者替换为别的文字 •根据模式匹配从字符串中提取一个子字符串.可以用来在文本或输入字段中查找特定文字 正则表达式语法 一个正则表达式就是由普通字符(例如字符 a 到 z)以及特殊字符(称为元字符

js 正则表达式 查找

<script>var str='<p><img style="width: 140px; height: 105px;" src="/ckfinder/userfiles/images/qi_cym.jpg" data-cke-saved-src="/ckfinder/userfiles/images/qi_cym.jpg"></p><p><br></p>';

js正则表达式:验证邮箱格式、密码复杂度、手机号码、QQ号码

直接上代码 Java 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83

Python之路-(js正则表达式、前端页面的模板套用、Django基础)

js正则表达式 前端页面的模板套用 Django基础 js正则表达式: 1.定义正则表达式 /.../  用于定义正则表达式 /.../g 表示全局匹配 /.../i 表示不区分大小写 /.../m 表示多行匹配 登录注册验证: test: 判断字符串是否符合规定的规则 rep = /\d+/;   (定义规则) rep.test('')   (引号里面必须包含字母和数字才返回true,否则为false) rep = /^\d+$/; (只有是纯数字时候才返回true,否则是false) exe

js正则表达式进行格式校验

今天做了个js正则表达式的练习,利用正则表达式进行注册信息格式验证,注册信息界面如下: 格式要求: 1.学号项不能为空,必须为纯数字,不能与数据库中的重复,正则表达式/^\d+$/g: 2.姓名项不能为空: 3.密码不能为空且无空格判断空格text.split(" ").length != 1,安全等级分为3个等级,若全为字母或者数字为1级,正则表达式(text.search(/^[a-zA-Z]+$/g) != -1) || (text.search(/^[0-9]+$/g) !=