一、简单介绍

1、什么是正則表達式

正則表達式本身就是一种语言，这在其他语言是通用的。

正則表達式(regular expression)描写叙述了一种字符串匹配的模式，能够用来检查一个串是否含有某种子串、将匹配的子串做替换或者从某个串中取出符合某个条件的子串等。

str.indexOf(‘abc’); //精确匹配 仅仅能匹配字符串“abc”

正則表達式 //模糊匹配

Where name=’zhangsan’; //精确匹配

Where name like ‘zhang%’; //姓名以zhang開始的字符串

2、为什么使用正則表達式

1）验证邮箱

2）手机号

3）银行卡号

4）採集器

186lO659839

5）中奖信息 186****9839

6）屏蔽特殊词汇

3、高速入门

1）查找一个字符串中是否具有数字“8”

2）查找一个字符串中是否具有数字

    /*var str='hello,javascript,php';

    var reg=/\d/gi;

    alert(reg.test(str));*/

3）查找一个字符串中是否具有非数字

    var str='1861o659839';

    var reg=/\D/gi;

    alert(reg.test(str));

二、正则对象

要使用正則表達式，必须要在程序创建正则对象

1、怎样创建正则对象？

我们须要得到一个RegExp类的实例

1）隐式创建

var 对象=/匹配模式/匹配标志; ‘’ [] {}

        /*var reg=/\d/gi;

        alert(typeof reg);

        alert(reg.constructor);*/

2）直接实例化

var 对象=new RegExp(“匹配模式”,’匹配标志’);

        var reg=new RegExp("abcd",'gi');

        alert(typeof reg);

        alert(reg.constructor);

以上两种使用方法差别：

Var reg=/\d/gi;

假设使用直接实例化。那么像“\d”这种字符。须要转义”\d”。例如以下：

Var reg=new RegExp(“\\d”,”gi”);

2、匹配标志：

g：全局匹配

i：忽略大写和小写

三、怎样使用正则对象

在js中，使用正则对象主要有两种使用方法：

1、RegExp类

test(str) ：匹配指定的模式(參数)是否出如今字符串中（返回有没有）

reg.test(str);

exec(str) ：返回匹配模式的字符串 （复杂，返回详细内容）

reg.exec(str);

2、Sring类

search ：匹配符合匹配模式的字符串出现的位置。没有匹配到则返回-1

str.search(reg);

match ：以数组形式返回匹配模式的字符串，没有匹配到则返回null

str.match(reg);

replace ：使用指定的内容替换匹配模式的字符串

str.replace(reg,”content”);（两个參数）

split ：使用匹配模式的字符串做为分隔符对字符串进行切割，返回数组

str.split(reg);

<head>

    <script language='javascript' src='public.js'></script>

    <script>

        window.onload=function(){

            $('btn1').onclick=function(){

                var content=$('content').value;

                var reg=/\d\d\d/i;

                var result=reg.test(content);

                alert(result);

            };

            $('btn2').onclick=function(){

                var content=$('content').value;

                var reg=/\d\d\d/g;

                var result;

                while(result=reg.exec(content)){

                    alert(result);

                }

            };

            $('btn3').onclick=function(){

                var content=$('content').value;

                var reg=/\d\d\d/gi;

                var result=content.search(reg);

                alert(result);

            };

            $('btn4').onclick=function(){

                var content=$('content').value;

                var reg=/\d\d\d/gi;

                var result=content.match(reg);

                alert(result);

            };

            $('btn5').onclick=function(){

                var content=$('content').value;

                var reg=/\d/gi;

                var result=content.replace(reg,'*');

                alert(result);

            };

            $('btn6').onclick=function(){

                var content=$('content').value;

                var reg=/\d\d\d/gi;

                var result=content.split(reg);

                alert(result);

            };

        };

    </script>

</head>

<body>

<input type='text' id='content' size=50>

<br>

<br>

<input type='button' id='btn1' value='test'>

<input type='button' id='btn2' value='exec'>

<input type='button' id='btn3' value='search'>

<input type='button' id='btn4' value='match'>

<input type='button' id='btn5' value='replace'>

<input type='button' id='btn6' value='split'>

</body>

RegExp

  1. test
  2. exec

String

  • Search
  • Match
  • Replace
  • Split

不同的情况下使用不同的方法

如：

我想知道邮箱格式、手机格式、IP格式合不合法，用test

假设想抓取网页中全部的手机号。使用exec或match

想替换掉网页中敏感词汇，用replace

四、几个重要的概念

  • 子表达式

在正则匹配模式中，使用一对括号括起来的内容是一个子表式

  • 捕获

在正则匹配模式中，子表达式匹配到的内容会被系统捕获至系统的缓冲区中

  • 反向引用（后向引用）

捕获之后，能够在匹配模式中，使用\n (n：数字)来引用系统的第n号缓冲区内容



例1：

匹配多个字符后面是三个数字。后面的内容和前面多个字符同样，

如：abc123abc

var str='aaaphp123phpaaajavascript589javascriptaasma470smbaa';

var reg=/(\w+)\d\d\d\1/gi;

var result=str.match(reg);

alert(result);*/

例2：习题：

查找连续的四个数字。如：3569

var reg=/\d\d\d\d/gi; \d{4}

查找连续的同样的四个数字，如：1111

var reg=/(\d)\1\1\1/gi;

查找数字，如：1221,3443

Var reg=/(\d)(\d)\2\1/gi;

查找字符，如：AABB,TTMM

Var reg=/(\w)\1(\w)\2/gi;

查找连续同样的四个数字或四个字符

Var reg=/(\w)\1\1\1/gi;

普通情况，后面的内容要求与前面的一致。就会用到子表达式、捕获、反向引用的概念

例3：在一个字符串，查找一对html标记以及中间的内容(好样例)

var str='adsfsadf<div>商品</div>adsflkj<p>100.00</p>sadfsadf';

var reg=/<(\w+)>.+<\/\1>/gi;

alert(str.match(reg));

例4：关于子表达式和exec方法

<script> 

    var str='ad1221sdsalkf4554sadlkj7667fsad1234fds';

    var reg=/(\d)(\d)\2\1/gi;

    var result;

    while(result=reg.exec(str)){

        alert(result);

        //result[0] ==>1221

        //result[1] ==>1

        //result[2] ==>2 

        //.......

    }

    /*var str='aaaphp123phpaaajavascript589javascriptaasma470smbaaa';

    var reg=/(\w+)(\d)\d\d\1/gi;

    var result;

    while(result=reg.exec(str)){

        alert(result);

    }*/

    //每一次匹配都放到一个数组中

    //数组结构：

    //result[0] ====> php123php

    //result[1] ====> 第一个子表达式匹配的结果 php

    //result[2] ====> 第二个子表达式匹配的结果  1

    //result[0] ====> javascript589javascript

    //result[1] ====> javascript

    //result[2] ====> 5

</script>

exec方法和match方法的比較：

Exec方法是RegExp类下的方法

Match是String下的方法

Match方法直接返回一个数组

Exec方法须要使用循环重复调用

假设有子表达式，exec方法会将子表达式的捕获结果放到数组相应的数组元素中

五、正则语法细节

正則表達式是由普通字符（比如字符 a 到 z）以及特殊字符（称为元字符）组成的文字模式。正則表達式作为一个模板，将某个字符模式与所搜索的字符串进行匹配。

正則表達式的构成：

1）普通字符 ：a b c d 1 2 3 4 ……..

2）特殊字符（元字符）：\d \D \w . …….

我们在写正則表達式的时候。须要确定这样几件事：

1）我们要查什么

2）我们要从哪查

3）我们要查多少

1、限定符

限定符能够指定正則表達式的一个给定组件必须要出现多少次才干满足匹配。

* — 匹配前面的组件零次或多次

+ — 匹配前面的组件一次或多次

?

— 匹配前面的组件零次或一次

{n} — 匹配确定的 n 次

{n,} — 至少匹配n 次

{n,m} — 最少匹配 n 次且最多匹配 m 次

也能够使用下面方式表示：

* == {0,}

+ =={1,}

?

=={0,1}

代码：

例1：

结果：

例2：



结果：

例3：

结果：

\d{3,5} ：如在上题字符串中，既匹配三个，也能够匹配五个，那么，正則表達式中会自己主动匹配多的那一种，这在正则中贪婪匹配原则。

假设在表达式的后面使用”？”，表示非贪婪匹配原则，就会尽可能匹配少的，示比例如以下：

例4：

{3,5}? 表示匹配3个

2、字符匹配符

字符匹配符用于匹配某个或某些字符

  • 字符簇

    • [a-z] ：表示a-z随意一个字符
    • [A-Z] ：表示A-Z随意一个字符
    • [0-9] ：表示0-9随意一个数字
    • [0-9a-z] ：表示0-9 a-z随意一个字符
    • [0-9a-zA-Z] ：表示0-9 a-z A-Z随意一个字符
    • [abcd] ：表示a 或b 或c 或 d
    • [1234] ：表示 1 或2 或3 或 4
    • [^a-z] ：表示匹配除了a-z之间随意一个字符
    • [^0-9] ：表示匹配除了0-9之间随意一个字符
    • [^abcd] ：表示匹配除a b c d 之外的随意一个字符
    • \d ：匹配一个数字字符。[0-9]
    • \D ：匹配一个非数字字符。[^0-9]
    • \w ：匹配包含下划线的不论什么单词字符。[0-9a-zA-Z_]
    • \W ：匹配不论什么非单词字符。[^\w]
    • \s ：匹配不论什么空白字符 空格、制表符、换行符
    • \S ：匹配不论什么非空白字符。

    • . ：匹配除 “\n” 之外的不论什么单个字符 假设想匹配随意字符 [.\n]

3、定位符

定位符能够将一个正則表達式固定在一行的開始或结束。也能够创建仅仅在单词内或仅仅在单词的開始或结尾处出现的正則表達式。

^ 匹配输入字符串的開始位置

$ 匹配输入字符串的结束位置

\b 匹配一个单词边界

\B 匹配非单词边界

例1：

<script>

    var str='hello,php!你好JavaScript_,123,javA!';

    //var reg=/[0-9]/gi;    //1,2,3

    //var reg=/[A-Z]/g;     //J,S,A 注意：这里没有i标识

    //var reg=/[hp2r]/g;    //h,p,h,p,r,p,2

    //var reg=/[^a-z2]/g;   //匹配除了a-z和数字2之外的随意一个字符

    //var reg=/\D/g;        //匹配非数字

    //var reg=/\w/gi;       // 匹配大写和小写字母、数字、下划线

    var reg=/./gi;          //匹配全部字符，除了\n

    alert(str.match(reg));

</script>

例2：验证年龄

<script>

    /*var str='18';

    var reg=/^\d\d$/gi;

    alert(reg.test(str));*/

</script>

4、转义符

\ 用于匹配某些特殊字符

例1：

    var str='hello,my name is .zhangsan.';

    var reg=/\./gi;

    alert(str.match(reg));

上题中。假设直接使用 /./ 匹配的是随意一个字符。我们仅仅想匹配字符‘.’，所以须要转义

须要的转义字符：

(

)

[

]

{

}

\

.

/

*

+

?

^

$

5、选择匹配符

| 能够匹配多个规则

代码：

<script>

var str='hello,javascript.hello,php.';

    //var reg=/hello,javascript|php/gi;

    //hello,javascript,php

var reg=/hello,(javascript|php)/gi;

    //hello,javascript,hello,php

alert(str.match(reg));

</script>

六、关于正則表達式的几种特殊使用方法

1、(?

=)

正向预查

2、 (?!)

负向预查

3、 (?:)

匹配内容，结果不被捕获

script>

    /*var str='李东超好人,李东超大侠。

李东超帅哥！';

    //我想查询不是“好人”前面的名字

    var reg=/李东超(?!好人)/gi;

    alert(str.match(reg));

    alert(RegExp.lastIndex);*/

    var str='hellojavascript,hellophp,hellojava,helloajax';

    var reg=/hello(?:javascript|php)/gi;

    var result;

    while(result=reg.exec(str)){

        alert(result);

    }

</script>

上题中，(javascript|php)会被当做子表达式来处理，内容会被捕获。但在程序中，捕获的内容没有不论什么用途，这种情况下。能够使用（?

:）符合。让系统不去捕获子表达式匹配的内容

七、正则学习工具



代码：

<head>

    <script language='javascript' src='public.js'></script>

    <script>

        window.onload=function(){

            $('btn1').onclick=function(){

                var content=$('content').value;

                var exp=$('exp').value;

                var reg=eval('/'+exp+'/gi');

                var result=reg.test(content);

                $('result').value=result;

            };

            $('btn2').onclick=function(){

                var content=$('content').value;

                var exp=$('exp').value;

                var reg=eval('/'+exp+'/gi');

                var result;

                $('result').value='';

                while(result=reg.exec(content)){

                    $('result').value+=result+'\n';

                }

            };

            $('btn3').onclick=function(){

                var content=$('content').value;

                var exp=$('exp').value;

                var reg=eval('/'+exp+'/gi');

                $('result').value=content.search(reg);

            };

            $('btn4').onclick=function(){

                var content=$('content').value;

                var exp=$('exp').value;

                var reg=eval('/'+exp+'/gi');

                $('result').value=content.match(reg);

            };

            $('btn5').onclick=function(){

                var content=$('content').value;

                var exp=$('exp').value;

                var reg=eval('/'+exp+'/gi');

                $('result').value=content.replace(reg,'*');

            };

            $('btn6').onclick=function(){

                var content=$('content').value;

                var exp=$('exp').value;

                var reg=eval('/'+exp+'/gi');

                $('result').value=content.split(reg);

            };

        };

    </script>

</head>

<body>

内容：<input type='text' id='content' size=60><br><br>

正则：<input type='text' id='exp' size=40><br><br>

结果：<textarea id='result' cols='60' rows='8'></textarea><br><br>

<input type='button' id='btn1' value='test'>

<input type='button' id='btn2' value='exec'>

<input type='button' id='btn3' value='search'>

<input type='button' id='btn4' value='match'>

<input type='button' id='btn5' value='replace'>

<input type='button' id='btn6' value='split'>

</body>

八、正则习题：

1、验证手机号是否有效

    var str='13890008000';

    var reg=/^13[0-35-9]\d{8}$/gi;

    if(reg.test(str)){

        alert('合法');

    }else{

        alert('不合法');

    }

2、验证邮箱是否有效

    var str='zhang.san@163.com.com.com.cn';

    var reg=/^[\w\.]+@(\w+\.)+[a-z]{2,4}$/gi;

    if(reg.test(str)){

        alert('合法');

    }else{

        alert('不合法');

    }

3、验证ip地址是否有效

    /*1.1.1.1

    0--255

    第一个段不能是0

    不能以0开头  如：086*/

    var str='1.1.1.1';

    var reg=/^([1-9]|[1-9][0-9]|1[0-9][0-9]|

    2[0-4][0-9]|25[0-5])(\.([0-9]|[1-9][0-9]

    |1[0-9][0-9]|2[0-4][0-9]|25[0-5])){3}$/gi;

    if(reg.test(str)){

        alert('合法');

    }else{

        alert('不合法');

    }

九、结巴程序

结巴程序

我…我是是..一个个…帅帅帅帅…哥!”;

我是一个帅哥。

replace();

Try…catch语句

例1：

    var str='我我我...我我...是是...一一个个个个...帅帅帅帅帅帅帅帅帅帅哥！';

    var reg=/\./gi;

    //将全部.替换成空

    str=str.replace(reg,'');

    alert(str);

    //我我我我是是是是一个个个

    reg=/(.)\1+/gi;

    //使用1号缓冲区内容替换重复的内容

    str=str.replace(reg,'$1');

    alert(str);

display()函数未定义，运行第5行代码时。出错，会被catch语句捕获，错误的相关信息会被保存到对象e中

例2：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> New Document </title>

  <meta name="Generator" content="EditPlus">

  <meta name="Author" content="">

  <meta name="Keywords" content="">

  <meta name="Descriptio
posted @
2017-07-22 18:51 
zhchoutai 
阅读(...) 
评论(...) 
编辑 
收藏

JavaScript 正則表達式的更多相关文章

  1. javascript 正則表達式补充

    定义 JavaScript种正則表達式有两种定义方式,定义一个匹配类似 <%XXX%> 的字符串 1. 构造函数 var reg=new RegExp('<%[^%>]+%&g ...

  2. JavaScript正則表達式知识汇总

    Js 正則表達式知识汇总 正則表達式: 1.什么是RegExp?RegExp是正則表達式的缩写.RegExp 对象用于规定在文本中检索的内容. 2.定义RegExp:var +变量名=new RegE ...

  3. javascript正則表達式 &quot;\b&quot;问题

    preface 昨晚在看<javascript权威指南>后.看见作者自己封装一个兼容全部浏览器的山寨HTML5新API classLIst类.自己想了想认为自己也要去玩一下.可是能力还是有 ...

  4. DOM笔记（十）：JavaScript正則表達式

    一.RegExp ECMAScript通过RegExp类型类支持正則表達式,语法和Perl类似: var exp = /pattern/flags; patternb部分是不论什么简单的或复杂的正則表 ...

  5. 经常使用的正則表達式归纳—JavaScript正則表達式

    来源:http://www.ido321.com/856.html 1.正则优先级 首先看一下正則表達式的优先级,下表从最高优先级到最低优先级列出各种正則表達式操作符的优先权顺序: 2.经常使用的正則 ...

  6. javascript——正則表達式

    正則表達式(RegExp对象):主要用于表单验证 1.创建正則表達式: (1).var ret = /pattern/; pattern是内容.能够是正則表達式的内容,能够是字符或是其它的内容 (2) ...

  7. javascript正則表達式

    定义一个正則表達式 能够用字面量 var regex = /xyz/; var regex = /xyz/i; 也能够用构造函数 var regex = new RegExp('xyz'); var ...

  8. JavaScript使用正則表達式

    2.0 简单介绍 正則表達式是能够用来查找与给定模式匹配的文本的搜索模式.比如,在上一章中,我们在一个较长的字符串中查找子字符串Cookbook: var testValue = "This ...

  9. js正則表達式语法

    1. 正則表達式规则 1.1 普通字符 字母.数字.汉字.下划线.以及后边章节中没有特殊定义的标点符号,都是"普通字符".表达式中的普通字符,在匹配一个字符串的时候,匹配与之同样的 ...

随机推荐

  1. golang panic and recover

    panic 是一个内置函数,当一个函数 F 调用 panic,F 的执行就会停止,F 中 deferred 函数调用会被执行,然后 F 返回控制到它的调用者.这个过程会沿着调用栈执行下去,直到当前 g ...

  2. Vue 的 createElement 函数的参数问题的小笔记

    官方文档的说明. 第二个参数的值是要生成的标签的属性数据.点击查看详情. 第三个参数则是组件标签内的数据,数据里面的内容会渲染在第一个参数的标签内.通常会在此指定各插槽 slot 对应的位置,也可以在 ...

  3. 3.lombok系列3：lombok的实验类特性

    转自:https://blog.csdn.net/54powerman/article/details/72516755 lombok除了已经推荐使用的基本功能,还维护了一个创新型的注解,有些功能有违 ...

  4. solr/lucence和关系数据库的混合使用

    我们知道solr提供了一个DIHandler,提供将关系数据库中的数据导成索引,然后使用solr查询. 对于一个大表中关联数个小表的查询,这非常耗费时间. 我的思路是: 1. 将一个大表做成索引,使用 ...

  5. TabControl里面添加From

    private void dynamicDll() { string dllName = "dll"; Assembly ass = Assembly.Load(dllName); ...

  6. Java Web学习总结（5）——HttpServletResponse对象详解

    一.HttpServletResponse常见应用--生成验证码 1.1.生成随机图片用作验证码 生成图片主要用到了一个BufferedImage类, 生成随机图片范例: package gacl.r ...

  7. 项目太大tomcat启动不起来

    双击server,Open launch configuration Arguments VM arguments增加参数: -Xms512m -Xmx1024m -Xss4m -XX:PermSiz ...

  8. 目标识别（object detection）中的 IoU（Intersection over Union）

    首先直观上来看 IoU 的计算公式: 由上述图示可知,IoU 的计算综合考虑了交集和并集,如何使得 IoU 最大,需要满足,更大的重叠区域,更小的不重叠的区域. 两个矩形窗格分别表示: 左上点.右下点 ...

  9. 中英文对照 —— 标点符号（punctuation）

    有限的几个: What Are the Fourteen Punctuation Marks in English Grammar? period:句号:comma:逗号:冒号:colon:分号:se ...

  10. 算法-对分查找（二分查找）C++实现

    这个是个主要的查找算法.由于仅仅是把数读入就须要(N)的时间量,因此我们在说这类问题的时候都是如果读入过的. 在算法经常使用的时间.将问题缩小为一部分(大约1/2),那么我们就觉得这个算法是O(log ...