美文网首页
js正则表达式

js正则表达式

作者: DecadeHeart | 来源:发表于2017-04-15 18:25 被阅读0次

    正则表达式功能:

    • 测试字符串的某个模式。例如对一个输入字符串进行测试,看在该字符串是否存在一个电话号码模式或一个信用卡号码模式。这称为数据有效性验证

    • 替换文本。可以在文档中使用一个正则表达式来标识特定文字,然后全部删除,替换为其他文字

    • 根据模式匹配从字符串中提取一个字符串。可以用来在文本或输入字段中查找特定文字。

    创建正则表达式

    var re = new RegExp();//RegExp是一个对象,和Aarray一样  
    //但这样没有任何效果,需要将正则表达式的内容作为字符串传递进去  
    re =new RegExp("a");//最简单的正则表达式,将匹配字母a  
    re=new RegExp("a","i");//第二个参数,表示匹配时不分大小写  
    

    RegExp构造函数第一个参数为正则表达式的文本内容,而第一个参数则为可选项标志,标志可以组合使用

    • g全文查找

    • i忽略大小写

    • m多行查找

    var re = new RegExp("a","gi");//匹配所有的a或A  
    

    正则表达式还有另一种正则表达式字面量的声明方式

    var re=/a/gi;
    

    和正则表达式相关的方法和属性
    正则表达式对象的方法

    • test,返回一个Boolean值,它指出在被查找的字符串中是否存在模式。如果存在则返回true,否则返回false。
    • exec,用正则表达式模式在字符串中运行查找,并返回包<script type="text/javascript" src="http://www.iteye.com/javascripts/tinymce/themes/advanced/langs/zh.js"></script><script type="text/javascript" src="http://www.iteye.com/javascripts/tinymce/plugins/javaeye/langs/zh.js"></script>含该查找结果的一个数组。
    • complie,把正则表达式编译为内部格式,从而执行得更快。正则表达式对象的属性。
    • source,返回正则表达式模式的文本的副本,只读。
    • lastIndex,返回字符位置,它是被查找字符串中下一次成功匹配的开始位置。
    • l...9,返回九个在模式匹配期间找到的、最近保存的部分。只读
    • input($_),返回执行规范表述查找的字符串。只读。
    • lastMatch($&),返回任何正则表达式搜索过程中的最后匹配的字符。只读。
    • lastParen($+)如果有的话,返回任何正则表达式查找过程中最后括的子匹配。只读。
    • leftContext($`),返回被查找的字符串中从字符串开始位置到最后匹配之前的额位置之间的字符。只读。
    • rightContext($`),返回被搜索的字符串中从最后一个匹配位置开始到字符串结尾之间的字符。只读。
      String对象一些和正则表达式相关的方法
    • match,找到一个或多个正则表达式的匹配。
    • replace,替换与正则表达式匹配的字符串
    • search,检索与正则表达式相匹配的值
    • split,把字符串分割为字符串数组

    测试正则表达式是如何工作的

    //test方法,测试字符串,符合模式时返回true,否则返回false  
    var re = /he/;//最简单的正则表达式,将匹配he这个单词  
    var str = "he";  
    alert(re.test(str));//true  
    str = "we";  
    alert(re.test(str));//false  
    str = "HE";  
    alert(re.test(str));//false,大写,如果要大小写都匹配可以指定i标志(i是ignoreCase或case-insensitive的表示)  
    re = /he/i;  
    alert(re.test(str));//true  
    str = "Certainly!He loves her!";  
    alert(re.test(str));//true,只要包含he(HE)就符合,如果要只是he或HE,不能有其它字符,则可使用^和$  
    re = /^he/i;//脱字符(^)代表字符开始位置  
    alert(re.test(str));//false,因为he不在str最开始  
    str = "He is a good boy!";  
    alert(re.test(str));//true,He是字符开始位置,还需要使用$  
    re = /^he$/i;//$表示字符结束位置  
    alert(re.test(str));//false  
    str = "He";  
    alert(re.test(str));//true  
    //当然,这样不能发现正则表达式有多强大,因为我们完全可以在上面的例子中使用==或indexOf  
    re = /\s/;// \s匹配任何空白字符,包括空格、制表符、换页符等等  
    str= "user Name";//用户名包含空格  
    alert(re.test(str));//true  
    str = "user     Name";//用户名包含制表符  
    alert(re.test(str));//true  
    re=/^[a-z]/i;//[]匹配指定范围内的任意字符,这里将匹配英文字母,不区分大小写  
    str="variableName";//变量名必须以字母开头  
    alert(re.test(str));//true  
    str="123abc";  
    alert(re.test(str));//false  
    

    ^脱字符代表字符开始位置
    $表示字符结束位置
    \s匹配任何空白字符,包括空格、制表符、换页符等等
    当然,仅仅知道了字符串是否匹配模式还不够,我们需要知道哪些字符匹配了模式

    var osVersion="Ubuntu 8"; //其中的8表示系统主版本号
    var re=/^[a-z]+\s+\d+$/i; //+号表示字符至少要出现1次,\s表示空白字符,\d表示一个数字
    alert(re.test(osVersion)); //true,但我们想知道主版本号
    //另一个方法exec,返回一个数组,数组的第一个元素为完整的匹配内容
    re=/^[a-z]+\s+\d+$/i;
    arr=re.exec(osVersion);
    alert(arr[0]);//将osVersion完整输出,因为整个字符串刚好匹配re
    //我只需要取出数字
    re=/\d+/
    var arr=re.exec(osVersion);
    alert(arr[0])
    

    更复杂的用法,使用子匹配

    re=/^[a-z]+\s+(\d+)$/i;
    arr=re.exec(osVersion);
    alert(arr[0]);//整个osVersion,也就是正则表达式的完整匹配
    alert(arr[1]);//8,第一个子匹配,事实也可以这样取出主版本号
    re=/^[a-z]+\s+(\d+)\.(\d+)$/i //.是正则表达式元字符之一,若要用它的字面意义须转义
    arr=re.exec(osVersion);
    alert(arr[0]);
    alert(arr[1]);
    alert(arr[2]);
    

    注意,当字符串不匹配re时,exec方法将返回null
    String对象的一些和正则表达式有关的方法

    //replace对象的一些和正则表达式有关的方法
    var str="some money";
    alert(str.replace("some","much"));//much money
    var re=/\s/; //空白字符
    alert(str.replace(re,"%")); //some%money
    //在不知道字符串有多少空白字符时,正则表达式极为方便
    str="some some    \tsome\t\f";
    re=/\s+/
    alert(str.replace(re,"#")); //但这样只会将第一次出现的一堆空白字符替换掉//因为一个正则表达式只能进行一次匹配,\s+匹配了第一个空格后就退出了
    re=/\s+/g;//g,全局标志,将使正则表达式匹配整个字符串
    alert(str.replace(re,"@")); //some@some@some@//与另一个与之相似的是split
    var str="a-bd-c"
    var arr=str.split("-");//返回["a","bd","c"]
    //如果str是用户输入的,他可能输入a-bd-c也可能输入a bd c或a_bd_c,但不会是adbc(这样就说他输错了)
    str="a_db-c"; //用户以他喜欢的方式加分隔符s
    re=/[^a-z]/i; //前面我们说^表示字符开始,但在[]里它表示一个负字符集//匹配任何不在指定范围内的任意字符,这里将匹配除字母处的所有字符
    arr=str.split(re); //仍返回["a","bd","c"];
    //在字符串中查找时我们常用indexOf,与之对应用于正则查找的方法是search
    str="My age is 18.Golden age!"; //年龄不是一定的,我们用indexOf不能查找它的位置
    re=/\d+/;
    alert(str.search(re)); //返回查找到的字符串开始下标10
    //注意,因为查找本身就是出现第一次就立即返回,所以无需在search时使用g标志
    //下面的代码虽然不出错,但g标志是多余的
    re=/\d+/g;
    alert(str.search(re)); //仍然是10
    

    注意,当search方法没有找到匹配时,将返回-1
    类似于exec方法,String对象的match方法也用于将字符串与正则表达式进行匹配并返回结果数组

    var str="My name is CJ.Hello eveyone!"
    var re=/[A-Z]/;
    var arr=str.match(re);
    alert(arr); //数组中只会包含一个M,因为我们没有使用全局匹配
    re=/[A-Z]/g;
    arr=str.match(re);
    alert(arr); //M,C,J,H
    //从字符串中抽取单词
    re=/\b[a-z]*\b/gi; //\b表示单词边界
    str="one two three four";
    alert(str.match(re)); //one,two,three,four
    
    RegExp对象实例的一些属性
    var re=/[A-Z]/;
    //exec方法执行后,修改re的lastIndex属性
    var str="Hello,World!!!";
    var arr=re.exec(str);
    alert(re.lastIndex); //0,因为没有设置全局标志
    re=/[A-Z]/g;
    arr=re.exec(str);
    alert(re.lastIndex);  //1
    arr=re.exec(str);
    alert(re.lastIndex); //7
    

    当匹配失败,后面没有匹配,或lastIndex值大于字符串长度时,再执行exec等方法会将lastIndex设为0,开始位置

    var re = /[A-Z]/;  
    var str = "Hello,World!!!";  
    re.lastIndex = 120;  
    var arr = re.exec(str);  
    alert(re.lastIndex);//0  
    

    RegExp对象的静态属性

    //input 最后用于匹配的字符串(传递给test,exec方法的字符串)  
    var re = /[A-Z]/;  
    var str = "Hello,World!!!";  
    var arr = re.exec(str);  
    alert(RegExp.input);//Hello,World!!!  
    re.exec("tempstr");  
    alert(RegExp.input);//仍然是Hello,World!!!,因为tempstr不匹配  
    //lastMatch 最后匹配的字符  
    re = /[a-z]/g;  
    str = "hi";  
    re.test(str);  
    alert(RegExp.lastMatch);//h  
    re.test(str);  
    alert(RegExp["$&"]);//i  ,$&是lastMatch的短名字,但由于它不是合法变量名,所以要。。  
    //lastParen 最后匹配的分组  
    re = /[a-z](\d+)/gi;  
    str = "Class1 Class2 Class3";  
    re.test(str);  
    alert(RegExp.lastParen);//1  
    re.test(str);  
    alert(RegExp["$+"]);//2  
    //leftContext  返回被查找的字符串中从字符串开始位置到最后匹配之前的位置之间的字符  
    //rigthContext 返回被搜索的字符串中从最后一个匹配位置开始到字符串结尾之间的字符  
    re = /[A-Z]/g;  
    str = "123ABC456";  
    re.test(str);  
    alert(RegExp.leftContext);//123  
    alert(RegExp.rightContext);//BC456  
    re.test(str);  
    alert(RegExp["$`"]);//123A  
    alert(RegExp["$'"]);//C456  
    

    multiline属性返回正则表达式是否使用多行模式,这个属性不针对某个正则表达式实例,而是针对所有正则表达式,并且这个属性可写

    alert(RegExp.multiline);  
    //因为IE,Opera不支持这个属性,所以最好还是单独指定  
    var re = /\w+/m;  
    alert(re.multiline);  
    alert(RegExp["$*"]);//RegExp对象的静态属性不会因为给RegExp某个对象实例指定了m标志而改变  
    RegExp.multiline = true;//这将打开所有正则表达式实例的多行匹配模式  
    alert(RegExp.multiline); 
    

    使用元字符注意事项:元字符是正则表达式的一部分,当我们要匹配正则表达式本身时,必须对这些元字符转义.下面是正则表达式用到的所有元字符
    ( [ { \ ^ $ | ) ? * + .

    var str="?";
    var re=/?/;
    alert(re.test(str));//出错,因为?是元字符,必须转义
    re=/\?/;  //通过\转义
    alert(re.test(str)); //true
    

    使用RegExp构造函数与使用正则表达式字面量创建正则表达式注意点

    var str = "\?";  
    alert(str);//只会输出?  
    var re = /\?/;//将匹配?  
    alert(re.test(str));//true  
    re = new RegExp("\?");//出错,因为这相当于re = /\?/  
    re = new RegExp("\\?");//正确,将匹配?  
    alert(re.test(str));//true  
    

    既然双重转义这么不友好,还是用正则表达式字面量的声明方式
    怎样在正则表达式中使用特殊字符
    var re=/^\x43\x4A$/; //将匹配CJ
    alert(re.test("CJ"));//true
    //也可以使用八进制方式
    re=/^\103\112$/; //将匹配CJ
    //还可以使用unicode编码
    re=/^\u0043\u004A$/; //使用unicode必须使用u开头,接着是字符编码的四位16进制表现形式
    alert(re.test("CJ"));

    另处,还有一些其它的预定义特殊字符,如下表所示:

    字符 描述
    \n 换行符
    \r 回车符
    \t 制表符
    \f 换页符(Tab)
    \cX 与X对应的控制字符
    \b 退格符(BackSpace)
    \v 垂直制表符
    \0 空字符("")

    字符类 ---〉简单类,反向类,范围类,组合类,预定义类

    //简单类  
    var re = /[abc123]/;//将匹配abc123这6个字符中一个  
    //负向类  
    re = /[^abc]/;//将匹配除abc之外的一个字符  
    //范围类  
    re = /[a-b]/;//将匹配小写a-b 26个字母  
    re = /[^0-9]/;//将匹配除0-9 10个字符之处的一个字符  
    //组合类  
    re = /[a-b0-9A-Z_]/;//将匹配字母,数字和下划线 
    

    下面是正则表达式中的预定义类

    代码 等同于 匹配
    . IE下[\n],其它[\n\r] 匹配除换行符之外的任何一个字符
    \d [0-9] 匹配数字
    \D [^0-9] 匹配非数字字符
    \s [ \n\r\t\f\x0B] 匹配一个空白字符
    \S [^ \n\r\t\f\x0B] 匹配一个非空白字符
    \w [a-zA-Z0-9_] 匹配字母数字和下划线
    \W [^a-zA-Z0-9_] 匹配除字母数字下划线之外的字符

    量词(下表量词单个出现时皆是贪婪量词)

    代码 描述

    • 匹配前面的子表达式零次或多次。例如,zo* 能匹配 "z" 以及 "zoo"。 * 等价于{0,}。 
      
    • 匹配前面的子表达式一次或多次。例如,'zo+' 能匹配 "zo" 以及 "zoo",但不能匹配 "z"。+ 等价于 {1,}。 
      

    ? 匹配前面的子表达式零次或一次。例如,"do(es)?" 可以匹配 "do" 或 "does" 中的"do" 。? 等价于 {0,1}。
    {n} n 是一个非负整数。匹配确定的 n 次。例如,'o{2}' 不能匹配 "Bob" 中的 'o',但是能匹配 "food" 中的两个 o。
    {n,} n 是一个非负整数。至少匹配n 次。例如,'o{2,}' 不能匹配 "Bob" 中的 'o',但能匹配 "foooood" 中的所有 o。'o{1,}' 等价于 'o+'。'o{0,}' 则等价于 'o*'。
    {n,m} m 和 n 均为非负整数,其中n <= m。最少匹配 n 次且最多匹配 m 次。刘, "o{1,3}" 将匹配 "fooooood" 中的前三个 o。'o{0,1}' 等价于 'o?'。请注意在逗号和两个数之间不能有空格。

    贪婪量词与惰性量词
    •用贪婪量词进行匹配时,它首先会将整会字符串当成一个匹配,如果匹配的话就退出,如果不匹配,就截去最后一个字符进行匹配,如果不匹配,继续将最后一个字符截去进行匹配,直到有匹配为止。直到现在我们遇到的量词都是贪婪量词
    •用惰性量词进行匹配时,它首先将第一个字符当成一个匹配,如果成功则退出,如果失败,则测试前两个字符,依些增加,直到遇到合适的匹配为止

    var str = "abc";
    var re = /\w+/;//将匹配abc
    re = /\w+?/;//将匹配a

    var re = /[a-z]$/;
    var str = "ab\ncdef";
    alert(str.replace(re,"#"));//ab\ncde#
    re =/[a-z]$/m;
    alert(str.replace(re,"#"));//a#\ncde#

    分组与非捕获性分组

    re = /abc{2}/;//将匹配abcc  
    re = /(abc){2}/;//将匹配abcabc  
    //上面的分组都是捕获性分组  
    str = "abcabc ###";  
    arr = re.exec(str);  
    alert(arr[1]);//abc  
    //非捕获性分组 (?:)  
    re = /(?:abc){2}/;  
    arr = re.exec(str);  
    alert(arr[1]);//undefined
    

    候选(也就是所说的“或”)

    re = /^a|bc$/;//将匹配开始位置的a或结束位置的bc  
    str ="add";  
    alert(re.test(str));//true  
    re = /^(a|bc)$/;//将匹配a或bc  
    str ="bc";  
    alert(re.test(str));//true  
    

    当包含分组的正则表达式进行过test,match,search这些方法之后,每个分组都被放在一个特殊的地方以备将来使用,这些存储是分组中的特殊值,我们称之为反向引用

    var re = /(A?(B?(C?)))/;  
    /*上面的正则表达式将依次产生三个分组 
    (A?(B?(C?))) 最外面的 
    (B?(C?)) 
    (C?)*/  
    str = "ABC";  
    re.test(str);//反向引用被存储在RegExp对象的静态属性1—1—9中  
    alert(RegExp.$1+"\n"+RegExp.$2+"\n"+RegExp.$3);  
    //反向引用也可以在正则表达式中使用\1 ,\2...这类的形式使用  
    re = /\d+(\D)\d+\1\d+/;  
    str = "2008-1-1";  
    alert(re.test(str));//true  
    str = "2008-4_3";  
    alert(re.test(str));//false  
    

    当包含分组的正则表达式进行过test,match,search这些方法之后,每个分组都被放在一个特殊的地方以备将来使用,这些存储是分组中的特殊值,我们称之为反向引用

    var re = /(A?(B?(C?)))/;  
    /*上面的正则表达式将依次产生三个分组 
    (A?(B?(C?))) 最外面的 
    (B?(C?)) 
    (C?)*/  
    str = "ABC";  
    re.test(str);//反向引用被存储在RegExp对象的静态属性1—1—9中  
    alert(RegExp.$1+"\n"+RegExp.$2+"\n"+RegExp.$3);  
    //反向引用也可以在正则表达式中使用\1 ,\2...这类的形式使用  
    re = /\d+(\D)\d+\1\d+/;  
    str = "2008-1-1";  
    alert(re.test(str));//true  
    str = "2008-4_3";  
    alert(re.test(str));//false  
    

    使用反向引用可以要求字符串中某几个位置上的字符必须相同.另外,在replace这类方法中可用特殊字符序列来表示反向引用

    re = /(\d)\s(\d)/;
    str = "1234 5678";
    alert(str.replace(re,"221"));//在这个里面1表示第一个分组1234,1表示第一个分组1234,2则表示5678

    其它——〉正向前瞻,用来捕获出现在特定字符之前的字符,只有当字符后面跟着某个特定字符才去捕获它。与正向前瞻对应的有负向前瞻,它用匹配只有当字符后面不跟着某个特定字符时才去匹配它。在执行前瞻和负向前瞻之类的运算时,正则表达式引擎会留意字符串后面的部分,然而却不移动index

    //正向前瞻  
    re = /([a-z]+(?=\d))/i;  
    //我们要匹配后面跟一个数字的单词,然后将单词返回,而不要返回数字  
    str = "abc every1 abc";  
    alert(re.test(str));//true  
    alert(RegExp.$1);//every  
    alert(re.lastIndex);//使用前瞻的好处是,前瞻的内容(?=\d)并不会当成一次匹配,下次匹配仍从它开始  
    //负向前瞻(?!)  
    re = /([a-z](?!\d))/;i  
    //将匹配后面不包含数字的字母,并且不会返回(?!\d)中的内容  
    str = "abc1 one";  
    alert(re.test(str));  
    alert(RegExp.$1);//one  
    

    构建一个验证电子邮箱地址有效性的正则表达式。电子邮箱地址有效性要求(我们姑且这样定义):用户名只能包含字母数字以及下划线,最少一位,最多25位,用户名后面紧跟@,后面是域名,域名名称要求只能包含字母数字和减号(-),并且不能以减号开头或结尾,然后后面是域名后缀(可以有多个),域名后缀必须是点号连上2-4位英文字母

    var re = /^\w{1,15}(?:@(?!-))(?:(?:[a-z0-9-]*)(?:a-z0-9)(?:.(?!-)))+[a-z]{2,4}$/;

    理解二

    创建方式

    • 直接量词法
      /parttrn/attributes
    • chuangjian RegExp对象的语法
      new RegExp(pattern,attriubutes)
      语法属性说明:pattern我们写的正则表达式规则,而attributes则是规则的修饰符,g为全局匹配,i为区分大小写的匹配,m为多行匹配

    语法

    • 括号
      用于查找某个范围内的字符
    [acg]//匹配acg任一项即可
    [^acg]//匹配acg之外的任何一个字符
    [a-z]//匹配a-z
    [A-Z]//匹配A-Z
    (red|blue|green)//匹配其中任何一个即可
    
    • 元字符
      拥有特殊含义的字符
    .    //查找单个字符,除了换行以及行结束符
    \w   //查找单词字符
    \W   //查找非单词字符
    \d   //查找数字
    \D   //查找非数字
    \xxx //查找八进制书xxx规定的字符
    
    • 量词
      描述规则执行的次数要求以及位置要求
    n+ //匹配任何包含至少一个n的字符串
    n? //匹配任何包含零个或者一个n的字符串
    n* //匹配包含任一个n的字符串
    n{x,y}  //匹配包含x到y次n的字符串
    ^n  //匹配开头含有n的字符串
    n$  //匹配结尾有n的字符串
    ?=n //匹配任何其后紧跟指定字符串n的字符串
    ?!n //匹配任何其后没有紧跟字符串n的字符串
    \b  //匹配一个字边界,即字与空格间的位置
    \B  //非字边界匹配
    
    • 方法
      RegExp的方法
    • compile编译正则表达式
    • exec执行正则表达式,并返回找到的值与位置
    • test检查是否真的符合正则表达式的字符串,返回布尔值
      String对象的方法
    • search 检索与正则表达式相匹配的值
    • match找到一个或多个正则表达式的匹配、
    • replace 替换与正则表达式相匹配的子串
    • split 把字符串分割为字符串数组

    子表达式

    一个正则表达式可以分为许多子表达式
    例子:利用子表达式可以将通用资源指示符(URI)分解为其组件。假定您想将下面的URI分解为协议(ftp、http等等)、域地址和页/路径

    var test = http://www.w3cschool.cc:80/html/html-tutorial.html;
    /\w+:\/\/[^/:]+:\d*?[^# ]*/.exec(test)  
         //只可以匹配到链接
    //输出结果
    ["http://www.w3cschool.cc:80/html/html-tutorial.html",
     index: 0, input: "http://www.w3cschool.cc:80/html/html-tutorial.html"]      
    /(\w+):\/\/([^/:]+)(:\d*)?([^# ]*)/.exec(test)  
        //不仅可以匹配到链接,还可以把链接分为各个部分输出
    //输出结果
    ["http://www.w3cschool.cc:80/html/html-tutorial.html", 
    "http", "www.w3cschool.cc", ":80", "/html/html-tutorial.html", 
    index: 0, input: "http://www.w3cschool.cc:80/html/html-tutorial.html"]
    
    

    贪婪的量词

    ?*+三者都是贪婪的
    因为他们会尽可能多的匹配字符串,只要在后面添加一个?就可以实现非贪婪或者最小匹配

    <h1>Hello world!<h1>
    //下面的表达式匹配从 < 到关闭h1标记的 >之间的所有内容
    /<.*>/
    //如果你只需要匹配开始的h1标记,下面的非贪婪表达式只匹配<h1>
    /<.*?>/
    

    圆括号的副作用消除

    圆括号有一个副作用,那就是相关匹配会被缓存,此时可以在圆括号加上?:再写正则表达式

    /(?:<.*>)/

    String.match(/<.+>/g) 与 RegExp.exec(string)的区别

    • String.match(/<.+>/g)
      这个是字符串方法,返回数组,包括与正则表达式匹配的第一个或者所有字符串,是否返回多个值由修饰符g决定(不返回子表达式的匹配结果)
    • RegExp.exec(String)
      这个是正则表达式的对象特有方法,返回一个数组。数组包含:正则表达式匹配到的第一个字符串,各个子字符串匹配到的字符串。所以想要输出()的子字符串匹配的字符串必须使用exec,(?:)同样也只要在用exec的时候才能检测到效果

    相关文章

      网友评论

          本文标题:js正则表达式

          本文链接:https://www.haomeiwen.com/subject/umgbattx.html