欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

温故知新之javascript正则

程序员文章站 2022-06-08 12:21:24
...

因为没有系统的总结过正则表达式,工作中用到的也不到,主要靠百度现成的加改改不知道怎么就成功了,决心好好的学习一下正则表达式

新建正则表达式

  1. 使用字面量,以斜杠表示开始和结束

    var regex = /\s+/g;
  2. 使用RegExp构造函数

    var regex = new RegExp('\s+','g');
  3. 差别
    上面两种写法是等价的,都新建了一个正则表达式对象。它们的主要区别是,第一种方法在编译时新建正则表达式,第二种方法在运行时新建正则表达式。考虑到书写的便利和直观,实际应用中,基本上都采用字面量的写法。

属性

  1. 一类是修饰符相关,返回一个布尔值,表示对应的修饰符是否设置

    ignoreCase:返回一个布尔值,指忽略大小写,注意仅是忽略大小写,并不忽略全半角,该属性只读。
    global:返回一个布尔值,进行全局匹配,指匹配到目标串的结尾,该属性只读。
    multiline:返回一个布尔值,允许多行匹配,该属性只读。
    
    m修饰符表示多行模式(multiline),会修改^和$的行为。默认情况下(即不加m修饰符时),^和$匹配字符串的开始处和结尾处,加上m修饰符以后,^和$还会匹配行首和行尾,即^和$会识别换行符(\n)。
    /world$/.test('hello world\n') // false
    /world$/m.test('hello world\n') // true
    上面的代码中,字符串结尾处有一个换行符。如果不加m修饰符,匹配不成功,因为字符串的结尾不是“world”;加上以后,$可以匹配行尾。
    /^b/m.test('a\nb') // true
    上面代码要求匹配行首的b,如果不加m修饰符,就相当于b只能处在字符串的开始处。
  2. 另一类是与修饰符无关的属性,主要是下面两个

    lastIndex:返回下一次开始搜索的位置。该属性可读写
    source:返回正则表达式的字符串形式(不包括反斜杠),该属性只读
    
    正则对象的lastIndex属性不仅可读,还可写。一旦手动设置了lastIndex的值,
    就会从指定位置开始匹配。但是,这只在设置了g修饰符的情况下,才会有效。
    

方法

  1. test()
    正则对象的test方法返回一个布尔值,表示当前模式是否能匹配参数字符串

    reg.test(str)

    如果正则表达式带有g修饰符,则每一次test方法都从上一次结束的位置开始向后匹配。

    var r = /\s+/g;
    var s = 'a b c';
    
    r.lastIndex // 0
    r.test(s) // true
    
    r.lastIndex // 2
    r.test(s) // true
    
    r.lastIndex // 4
    r.test(s) // false
  2. exec()
    正则对象的exec方法,可以返回匹配结果。如果发现匹配,就返回一个数组,成员是每一个匹配成功的子字符串,否则返回null。
    如果正则表示式包含组匹配,则返回的数组会包括多个成员。第一个成员是整个匹配成功的结果,后面的成员就是圆括号对应的匹配成功的组。也就是说,第二个成员对应第一个括号,第三个成员对应第二个括号,以此类推。整个数组的length属性等于组匹配的数量再加1
    exec方法的返回数组还包含以下两个属性:

    • input:整个原字符串。

    • index:整个模式匹配成功的开始位置(从0开始计数)。

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

    var r = /a(b+)a/g;
    
    var a1 = r.exec('_abbba_aba_');
    a1 // ['abbba', 'bbb']
    a1.index // 1
    r.lastIndex // 6
    
    var a2 = r.exec('_abbba_aba_');
    a2 // ['aba', 'b']
    a2.index // 7
    r.lastIndex // 10
    
    var a3 = r.exec('_abbba_aba_');
    a3 // null
    a3.index // TypeError: Cannot read property 'index' of null
    r.lastIndex // 0
    
    var a4 = r.exec('_abbba_aba_');
    a4 // ['abbba', 'bbb']
    a4.index // 1
    r.lastIndex // 6

    当整个字符串到达尾部,正则对象的lastIndex属性重置为0,意味着以后的匹配将从头开始

字符串对象的方法

  1. match

    字符串对象的match方法对字符串进行正则匹配,返回匹配结果。
    如果正则表达式带有g修饰符,则该方法与正则对象的exec方法行为不同,会一次性返回所有匹配
    成功的结果。
    设置正则表达式的lastIndex属性,对match方法无效,匹配总是从字符串的第一个字符开始。
  2. search

    字符串对象的search方法,返回第一个满足条件的匹配结果在整个字符串中的位置。如果没有
    任何匹配,则返回-1。
    该方法会忽略g修饰符。设置lastIndex也无效,总是从第一个位置开始
  3. replace
    str.replace(search, replacement)

       搜索模式如果不加g修饰符,就替换第一个匹配成功的值,否则替换所有匹配成功的值。
    'aaa'.replace('a', 'b') // "baa"
    'aaa'.replace(/a/, 'b') // "baa"
    'aaa'.replace(/a/g, 'b') // "bbb"
  4. split

    字符串对象的split方法按照正则规则分割字符串,返回一个由分割后的各个部分组成的数组。
    `str.split(separator, [limit])`
    该方法接受两个参数,第一个参数是分隔规则,第二个参数是返回数组的最大成员数。

贪婪匹配

需要特别指出的是,正则匹配默认是贪婪匹配,也就是匹配尽可能多的字符
var re = /^(\d+)(0*)$/;
re.exec('102300'); // ['102300', '102300', '']
由于\d+采用贪婪匹配,直接把后面的0全部匹配了,结果0*只能匹配空字符串了。
必须让\d+采用非贪婪匹配(也就是尽可能少匹配),才能把后面的0匹配出来,如果想将贪婪模式改为非贪婪模式,可以在量词符后面加一个问号
var re = /^(\d+?)(0*)$/;
re.exec('102300'); // ['102300', '1023', '00']

匹配规则

温故知新之javascript正则

温故知新之javascript正则

温故知新之javascript正则

温故知新之javascript正则

扩展

  1. 切分字符串

    'a,b, c  d'.split(/[\s\,]+/); // ['a', 'b', 'c', 'd']
  2. 利用g修饰符允许多次匹配的特点,可以用一个循环完成全部匹配

    var r = /a(b+)a/g;
    var s = '_abbba_aba_';
    
    while(true) {
      var match = r.exec(s);
      if (!match) break;
      console.log(match);
    }link
    //["abbba", "bbb"]
    //["aba", "b"]
  3. replace的应用
    replace方法的一个应用,就是消除字符串首尾两端的空格。

    var a = '  aa  bb  ';
    
    a.replace(/^\s+|\s+$/g, '')
    //"aa  bb"

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

    'hello world'.replace(/(\w+)\s(\w+)/, '$2 $1')
    // "world hello"

    replace方法的第二个参数还可以是一个函数,将每一个匹配内容替换为函数返回值

参考资料

廖雪峰老师的教程
阮一峰老师的教程