资讯专栏INFORMATION COLUMN

初学JavaScript正则表达式

fai1017 / 3426人阅读

摘要:规定正则表达式直接量的每次运算都返回新对象。二正则对象的属性和方法属性个返回一个布尔值,表示是否设置了修饰符,该属性只读。返回正则表达式的字符串形式不包括斜杠,该属性只读。

一.创建正则表达的方式
    1.字面量或称为直接量(不需要用任何的关键字说明它是正则表达式,而是用斜杠来表示正则表达式的开始和结束)
        eg:    var reg = /^w/;
    
    2.对象
        eg: var reg = new RegExp("^w");
    
    attentions:
        1)因为简洁方便,字面量创建的方式用的居多。
        2)ES5规定正则表达式直接量的每次运算都返回新对象。
二、    正则对象的属性和方法
    1.属性(5个)
        ignoreCase:返回一个布尔值,表示是否设置了i修饰符,该属性只读。
        global:返回一个布尔值,表示是否设置了g修饰符,该属性只读。
        multiline:返回一个布尔值,表示是否设置了m修饰符,该属性只读。
        lastIndex:返回下一次开始搜索的位置。该属性可读写,但是只在设置了g修饰符时有意义。
        source:返回正则表达式的字符串形式(不包括斜杠),该属性只读。
    eg:    
            var reg = /Hello/ig;
            console.log(reg.ignoreCase);    //true  
            console.log(reg.global);        //true
            console.log(reg.multiline);        //false    
            console.log(reg.lastIndex);        //0
            console.log(reg.source);        //Hello
    2.方法(3个)
        test():    检索字符串中的指定值。返回值是 true 或 false。
        exec():    如果发现匹配,就返回一个数组,成员是每一个匹配成功的子字符串,否则返回null。
        compile():    用于改变 RegExp
    eg:
    1)    var reg1 = /Hello/ig;                    
        console.log(reg1.test("Hello World!"));//true
        console.log(reg1.lastIndex);            //5
        console.log(reg1.test("HELLO World!"));    //false
        //attention:    当正则表达式有g修饰时,每一次运算都会自动更新lastIndex,下次运算就从新的起点(lastIndex的值)开始寻求匹配,而不是把字符串按从左到右去检索。
        reg1.lastIndex = 0;
        console.log(reg1.test("HELLO World!"));    //true
        
    
    2)    var reg1 = /Hello/ig;
        var result = reg1.exec("Hello abc hello def");    
        console.log(result);        //["Hello"]
        console.log(result.input);    //Hello abc hello def
        console.log(result.index);     //0
        onsole.log(reg1.exec("Hello abc hello def"));    //["hello"]
        console.log("Hello abc hello def".match(reg1));    // ["Hello", "hello"]
    attention:    
                exec方法的返回数组还包含以下两个属性:
                    input:整个原字符串。
                    index:整个模式匹配成功的开始位置(从0开始计数)。
        
    3)    var patt1=new RegExp("e");
        console.log(patt1.test("The best things in life are free")); //true
        patt1.compile("d");
        console.log(patt1.test("The best things in life are free"));    //false        
三、语法
    1.修饰符及其描述        
        i    执行对大小写不敏感的匹配。
        g    执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
        m    执行多行匹配。
    2.元字符(Metacharacter)是拥有特殊含义的字符:
        .    查找单个字符,匹配除回车(
)、换行(
) 、行分隔符(u2028)和段分隔符(u2029)以外的所有字符。
        cX 表示Ctrl-[X],其中的X是A-Z之中任一个英文字母,用来匹配控制字符。
        [] 匹配退格键(U+0008),不要与混淆。
        
 匹配换行键。
        
 匹配回车键。
        	 匹配制表符tab(U+0009)。
        v 匹配垂直制表符(U+000B)。
        f 匹配换页符(U+000C)。
         匹配null字符(U+0000)。
        xhh 匹配一个以两位十六进制数(x00-xFF)表示的字符。
        uhhhh 匹配一个以四位十六进制数(u0000-uFFFF)表示的unicode字符。
        d 匹配0-9之间的任一数字,相当于[0-9]。
        D 匹配所有0-9以外的字符,相当于[^0-9]。
        w 匹配任意的字母、数字和下划线,相当于[A-Za-z0-9_]。
        W 除所有字母、数字和下划线以外的字符,相当于[^A-Za-z0-9_]。
        s 匹配空格(包括制表符、空格符、断行符等),相等于[	
vf]。
        S 匹配非空格的字符,相当于[^	
vf]。
         匹配词的边界。
        B 匹配非词边界,即在词的内部。    
    3.位置字符
        ^ 表示字符串的开始位置
        $ 表示字符串的结束位置
    
    attentions:
        1)当正则表达式用m(即multiline)修饰时,则^可以匹配每一行的行首,$可以匹配每一行的行末
        2)^用于中括号表示取非,简单地说,就是排除中括号中的所有元素。
    4.选择字符
        竖线符号()在正则表达式中表示“或关系”(OR)
        方括号([])所有可供选择的字符都放在方括号内,比如[xyz] 表示x、y、z之中任选一个匹配。
        连字符(-)表示字符的连续范围
        
        eg:
            "a".match("ab");        //["a"]
            "b".match("ab");        //["b"]
            "ab".match("ab");        //["a"]
    5.转义符
        正则模式中,需要用斜杠转义的,一共有12个字符:^、.、[、$、(、)、、*、+、?、{和。需要特别注意的是,如果使用RegExp方法生成正则对象,转义需要使用两个斜杠,因为字符串内部会先转义一次。如果是字面量生成,两次转义反而会弄巧成拙。
        eg:
            (new RegExp("1+1")).test("1+1")// false
            (new RegExp("1+1")).test("1+1")// true
            /1+1/.test("1+1")        //false
            /1+1/.test("1+1")        //true
    6.重复类
        ?    软性量词    出现零次或一次
        *    软性量词    出现零次或多次(任意次)
        +    软性量词    出现一次或多次(至少一次)
        {n}    硬性量词    对应零次或者n次
        {n,m}    软性量词    至少出现n次但不超过m次
        {n,}    软性量词    至少出现n次(+的升级版)

参考链接:http://javascript.ruanyifeng....

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/91283.html

相关文章

  • 一次性搞懂JavaScript正则达式之语法

    摘要:翻译成中文叫正则表达式。我们要记住的是三点其一,正则表达式是用来提取文本的。其三,正则表达式的语法对初学者不友好。另外,本专题只涉及语言的正则表达式,其他语言的规则可能略有不同。学正则表达式,受用一辈子。 本文是『horseshoe·Regex专题』系列文章之一,后续会有更多专题推出GitHub地址:https://github.com/veedrin/horseshoe博客地址(文章...

    XFLY 评论0 收藏0
  • 前端初学基础知识 1

    摘要:前端学习记录基础知识盒模型所有元素可以看作盒子,在中,这一术语是用来设计和布局时使用。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。按照层次结构像至低向上直到顶端,这就是事件冒泡。 前端学习记录 week 1 基础知识 CSS盒模型 所有HTML元素可以看作盒子,在CSS中,box model这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子,封装周围的HTM...

    MASAILA 评论0 收藏0
  • 前端初学基础知识 1

    摘要:前端学习记录基础知识盒模型所有元素可以看作盒子,在中,这一术语是用来设计和布局时使用。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。按照层次结构像至低向上直到顶端,这就是事件冒泡。 前端学习记录 week 1 基础知识 CSS盒模型 所有HTML元素可以看作盒子,在CSS中,box model这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子,封装周围的HTM...

    haobowd 评论0 收藏0
  • 前端初学基础知识 1

    摘要:前端学习记录基础知识盒模型所有元素可以看作盒子,在中,这一术语是用来设计和布局时使用。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。按照层次结构像至低向上直到顶端,这就是事件冒泡。 前端学习记录 week 1 基础知识 CSS盒模型 所有HTML元素可以看作盒子,在CSS中,box model这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子,封装周围的HTM...

    csRyan 评论0 收藏0
  • JS正则达式入门,看这篇就够了

    摘要:如果遇到非常的复杂的匹配,正则表达式的优势就更加明显了。关于正则表达式书写规则,可查看,上面说的很清楚了,我就不贴出来了。替换与正则表达式匹配的子串,并返回替换后的字符串。结语正则表达式并不难,懂了其中的套路之后,一切都变得简单了。 前言 在正文开始前,先说说正则表达式是什么,为什么要用正则表达式?正则表达式在我个人看来就是一个浏览器可以识别的规则,有了这个规则,浏览器就可以帮我们判断...

    wenzi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<