js正则表达式

1.通用字符组（匹配任意单个字符）

• \d ：任意数字符号
• \D：非数字符号
• \w ：字母和数字符号（单词符号）
• \W：非字母和数字符号
• \s：任意空白符号（空格，制表符，换行符等类似符号）
• \S：非空白符号
• . ：除了换行符以外的任意字符

2.特殊字符

• -：连字符，指定一个字符范围
• ^：脱字符，置于元素前，表示字符串起始位置
• $：表示字符串结束位置
• +：置于元素后，表示该元素重复一次或多次
• *：置于元素后，表示该元素重复零次或者多次
• ?：置于元素后，表示该部分模式可选，即出现0次或者1次；当该字符紧跟在任何一个其他限制符 (*, +, ?, {n}, {n,}, {n,m}) 后面时，匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串，而默认的贪婪模式则尽可能多的匹配所搜索的字符串。
• \b：字符边界
• |：逻辑或，/\d+|abc/ 表示匹配任意数字字符或者匹配字母集abc

3.特殊字符之"^"

• "^"这个字符在中括号”[]”中使用的话表示字符类的否定，即不匹配这组字符集中的所有字符。这里说的是直接在”[]”中使用，不包括嵌套使用。 也就说”[]”代表的是一个字符集，”^”只有在字符集中才是反向字符集的意思。
• 如果不在中括号”[]”中直接使用的话就表示限定开头，即/^2/表示以2开头

4.特殊字符之"\b"

• \b 可以放在正则表达式的开头或末尾，分别表示起始边界和结束边界，\b 修饰其后或其之前的所有字符。如上图：/\b12/ 表示匹配以12开头的字符集，/12\b/ 表示匹配以12结尾的字符集。
• \b 可以匹配字母、数字、汉字和下划线。

"\b"的用法测试2.png

• \b 同时出现在正则表达式开头和末尾表示绝对匹配，即字符集和正则表达式中的完全一致才为真。

5.正则表达式中的括号

• ()：() 内的内容表示的是一个子表达式，() 本身不匹配任何东西，也不限制匹配任何东西，只是把括号内的内容作为同一个表达式来处理。比如 /ab+/ 中 + 字符仅仅修饰 b，即 b 重复一次或多次；而 /(ab)+/ 中 ab 作为一个整体被 + 修饰，即 ab 重复一次或多次。
• []：[] 表示匹配 [] 中的任意字符，并且特殊字符写在 [] 会被当成普通字符来匹配。比如 /[(a+)]/ 表示匹配 "("、"a"、"+"、")" 四个字符中的任意一个。
• {}：{} 一般用来表示匹配的长度，即某个模式出现的次数或次数范围。比如，在某个元素后加上 {4}，表示该元素需要出现且只能出现4次；而 {2,4} 表示该元素至少出现2次，至多出现4次，{,5} 表示0到5次，{5,} 表示至少5次。

6. 正则表达式的修饰符

• g(global)：全局匹配；
• i(ignoreCase)：匹配时不区分大小写；
• m(multiline)：多行输入将被视为多行处理（此时开始 ^ 和结尾匹配 $ 可以在每行中进行匹配）；
• u(unicode)：对字符串采用unicode匹配。

7. 字符串replace方法

• 字符串有一个replace方法，用于将字符串中的一部分替换为另一个字符串，但是只能替换第一个匹配项，而JavaScript不存在replaceAll方法。

  
  

• replace方法的第一个参数可以是正则表达式，默认情况下也只会替换首先匹配的项，若在正则表达式后追加 g 选项(/p/g)，则会替换字符串的所有匹配项。

  
  

• 正则表达式后面的 i 选项表示不区分大小写，gi 表示不区分大小写且全局替换。

  
  

• replace函数返回新值，不影响旧值；replace函数第二个参数接受一个函数, 函数的第一个参数为匹配的字符串，接下来的参数为子表达式匹配的字符串，以下使用replace实现简易模板解析器

let data = {
    name: "luojian",
    isHandsome: true
}

let template = "<div><span>{{data.name}} is {{data.isHandsome ? 'handsome' : 'cute'}}</span></div>"

function templateParser(template, data){
    /* 
     1. replace函数返回新值，不影响旧值；replace函数第二个参数接受一个函数, 函数的第一个参数为匹配的字符串，接下来的参数为子表达式匹配的字符串
     如 item 为 {{data.name}}, exp 为 data.name
     2. 正则表达式需要加 ? 表示非贪婪模式，即匹配到第一个 }} 处
     3. new Function 接受的参数：最后一个表示函数表达式， 之前的参数表示函数介绍的参数
    */
    let newTemplate1 = template.replace(/{{(.+?)}}/g, function(item, exp){
        let fn = new Function("data", "return " + exp)
        return fn(data)
    })
    // 或者使用正则断言匹配出被{{}}包裹的表达式, 替换表达式后再替换掉{{}}
    // let newTemplate = template.replace(/(?<={{).+?(?=}})/g, function(item){
    //     let fn = new Function("data", "return " + item)
    //     return fn(data)
    // }).replace(/[{}]/g, "")
    return newTemplate
}

8.正则表达式中的断言：用于查找某些元素之前或之后的内容

• ?=pattern：零宽正向先行断言，要求已匹配字符序列之后的字符序列能够匹配pattern。如下正则表示匹配一个或多个非空格、=、;的字符，且该字符序列后面是=。

  
  匹配cookie的key.png

• ?<=pattern：零宽正向后行断言，要求已匹配字符序列的前面能够匹配pattern。如下正则表示匹配前面是=号，非空格、=、;的字符序列。

  
  匹配cookie的value.png
• ?!pattern：零宽负向先行断言，要求已匹配字符序列的后面不能匹配pattern。
• ?<!pattern：零宽负向后行断言，要求已匹配字符序列的前面不能匹配pattern。

9.其他（不常见）

ecec.png

• 正则表达式的exec方法以及字符串的match方法

• 其他正则表达式的符号可参考：https://www.cnblogs.com/yirlin/archive/2006/04/12/373222.html