JavaScript——正则

133 阅读2分钟

一、正则表达式\color{#b57aed}{一、正则表达式}

1.基本语法

var reg = /pattern/flags      pattern:正则表达式    flags:标识(修饰符)

先说标识符,标识主要包括:

     i   忽略大小写匹配
     m  多行匹配,即在到达一行文本末尾时还会继续寻常下一行中是否与正则匹配的项
     g  全局匹配, 模式应用于所有字符串,而非在找到第一个匹配项时停止

2.正则表达

元字符
\d : 0-9之间的任意一个数字
\d只占一个位置
\w : 数字,字母 ,下划线 0-9 a-z A-Z _
\s : 空格或者空白等
\D : 除了\d
\W : 除了\w
\S : 除了\s
. : 除了\n之外的任意一个字符
\ : 转义字符
| : 或者
() : 分组
\n : 匹配换行符
\b : 匹配边界 字符串的开头和结尾 空格的两边都是边界 => 不占用字符串位数
^ : 限定开始位置 => 本身不占位置
$ : 限定结束位置 => 本身不占位置
[a-z] : 任意字母 []中的表示任意一个都可以
[^a-z] : 非字母 []中^代表除了
[abc] : abc三个字母中的任何一个 [^abc]除了这三个字母中的任何一个字符
代表次数的量词元字符
* : 0到多个
+ : 1到多个
? : 0次或1次 可有可无
{n} : 正好n次;
{n,} : n到多次
{n,m} : n次到m次
规则:量词出现在元字符后面,限定出现在前面的元字符的次数,如   \d+ 表示一个或者多个数字   \d{5} 表示匹配连续5个数字

3.常用方法

正则的常用方法有test、match、search、replace及exec :

test方法

    在字符串中查找符合正则的内容,若查找到返回true,反之返回false

    用法:正则.test(字符串)

search方法

    在字符串搜索符合正则的内容,搜索到就返回出现的位置(从0开始,如果匹配的不只是一个字母,那只会返回第一个字母的位置), 如果搜索失败就返回 -1

    用法:字符串.search(正则)

match方法

    在字符串中搜索符合规则的内容,搜索成功就返回内容,格式为数组,失败就返回null

    用法:字符串.match(正则)
    注意: 如果正则式不开启全局匹配g,则默认匹配到第一个就停止

exec方法

    和match方法一样,搜索符合规则的内容,并返回内容,格式为数组

    用法:正则.exec(字符串);

replace方法

    查找符合正则的字符串,就替换成对应的字符串。返回替换后的内容

    用法:字符串.replace(正则,替换字符串/回调函数)
    注意: replace的第二个参数可以为一下两种情况
          1.替换字符串
          2.在回调函数,第一个参数指的是每次匹配成功的字符,回调返回值为替换字符串。回调可有多个参数,其余参数与捕获组有关。

4.贪婪与惰性模式

惰性模式,匹配到满足的串
贪婪模式, 匹配满足要求的最大串

    举个例子,在vue的差值语法中,模板编译需要匹配{{ }}中的内容。 对于如下片段,两种模式匹配的结果是

456abc{{name}}456dsfgage-}}abc

贪婪模式下,匹配的结果为 "{{name}}456dsfgage-}}",
惰性模式下,匹配结果应为"{{name}}"

那么怎样声明贪婪及惰性模式?
    贪婪模式的标示符:+,?, ,{n},{n,},{n,m}
    惰性模式:+?,??,
??,{n}?,{n,}?,{n,m}? 即在贪婪标识符后加?及转变为惰性模式

vue中差值语法匹配正则为(正则中的{}需加 / 转义):
        reg=/\{\{.+\}\}/g
此时为贪婪模式,加 ?修饰 + 贪婪标志符,转为惰性模式
        reg=/\{\{.+?\}\}/g
当然,此时匹配的是整个"{{name}}",其实需要的是获取{{}}里name这个属性进行替换,应此需要用到捕获组这个方法

5.捕获组

    捕获组的定义: 捕获组简单来说就是把正则表达式中用()匹配的内容,保存到内存中,方便调用。js中每一个括号匹配的内容可以被RegExp对象捕获到(最多匹配九个,可以通过返回一个数组索引来取得所有的括号匹配项.),存储在RegExp.$1中

var reg = /([a-z]+)(\d+)/;       //匹配一个或多个字母,和一个或多个数字
reg.test('hello666');            //ture
console.log(RegExp.$1)           //输出 hello,即匹配的第一个括号里的内容
console.log(RegExp.$2)           //输出 666  ,即匹配的第二个括号里的内容

捕获组主要应用在JavaScript String对象中可以使用正则表达式的方法:例如:

var str = 'hello666';
var reg = /([a-z]+)(\d+)/;
var result = str.replace(reg,`$2,$1`)                
console.log(result)        //结果为   666,hello

    上面说过,replace() 方法可以接受两个参数,第一个参数是正则,第二个参数可以是字符串或者是一个函数,表示用第二个参数的值替换正则匹配到的字符串。上面便是第二个参数是字符串时,$1对应第一组,$2表示第二组。
    当第二个参数是函数时,具有以下特点,
      1.函数的第一个参数为匹配结果串,其余参数一次为捕获组,其余参数个数由捕获组个数决定
      2.有几个捕获便还有几个参数。且有几个匹配项行数决定几次

例子如下

var str = '我叫{{name}}';
let reg=/\{\{(.+?)\}\}/g
tr=str.replace(reg,(_,g)=>{
    console.log(_);  //结果为{{name}}
    console.log(g);  //结果为name
    return '张三'
 })
console.log(str);//我叫张三