正则表达式

239 阅读3分钟

定义

他是一个**「规则」**:可以验证字符串是否符合某个规则(test),也可以把字符串中符合规则的内容捕获到(exec/match...)

创建方式

1.字面量创建方式

2.构造函数模式创建

组成

1.元字符

2.修饰符:放在正则表达式的外面 /j/g

基础知识

1、字符类

[直接量]
. (点号,小数点) 匹配任意单个字符,但是行结束符除外
\d   匹配一个0-9之间的阿拉伯数字。等价于[0-9]
\D   匹配任意一个不是0-9之间阿拉伯数字的字符。等价于[^0-9]。
\w   匹配任意一个字母、数字或下划线的字符。等价于 [A-Za-z0-9_]。
\W  匹配任意一个不是字母、数字或下划线的字符。等价于 [^A-Za-z0-9_]。
\s   匹配一个空白符,包括空格、制表符、换页符、换行符和其他 Unicode 空格。
\S   匹配一个非空白符。
\t    匹配一个水平制表符(tab)
\r    匹配一个回车符(carriage return)
\n   匹配一个换行符(linefeed)
\v   匹配一个垂直制表符(vertical tab)
\f    匹配一个换页符(form-feed)

2、数量词

x*   匹配前面的模式 x 0 或多次。
x+    匹配前面的模式 x 1 或多次。等价于 {1,}。
x*?    像上面的 * 一样匹配前面的模式 x,然而匹配是最小可能匹配。【非贪婪模式:优先匹配最小的次数】
x+?    像上面的 + 一样匹配前面的模式 x,然而匹配是最小可能匹配。【非贪婪模式:优先匹配最小的次数】
x?    匹配前面的模式 x 0 或 1 次。
x|y    匹配 x 或 y
x{n}   n 是一个正整数。前面的模式 x 连续出现 n 次时匹配
x{n,}    n 是一个正整数。前面的模式 x 连续出现至少 n 次时匹配。
x{n,m}   n 和 m 为正整数。前面的模式 x 连续出现至少 n 次,至多 m 次时匹配。

3、字符集合

[xyz]    一个字符集合(字符组)。匹配集合中的任意一个字符。【你可以使用连字符'-'指定一个范围。[0-9] [a-z] [A-Z]】
[^xyz]   一个反义或补充字符集(反义字符组)。匹配任意不在括号内的字符。【你也可以通过使用连字符 '-' 指定一个范围内的字符】

4、边界

^    匹配输入开始。如果多行(multiline)标志被设为 true,该字符也会匹配一个断行(line break)符后的开始处。
$    匹配输入结尾。如果多行(multiline)标志被设为 true,该字符也会匹配一个断行(line break)符的前的结尾处。
\b   匹配一个零宽单词边界(zero-width word boundary),如一个字母与一个空格之间。
\B   匹配一个零宽非单词边界(zero-width non-word boundary),如两个字母之间或两个空格之间。

5、分组

(x)   匹配 x 并且捕获匹配项。 这被称为捕获括号(capturing parentheses)。
\n    n 是一个正整数。一个反向引用(back reference),指向正则表达式中第 n 个括号(从左开始数)中匹配的子字符串。
eg:

/\w+:\/\/\w+(.)\w+\1\w+/

拓展:

a.在分组情况中,如果(x)后面有数量词修饰时;它也只算做一个()【括号】来算,而后面使用的\n来指向正则表达式中该括号时,
则是指向它重复次数的最后一次()【括号】里面所包含的内容。【可以使用str.match(正则表达式)不带g修饰符来输出进行检测查看】
b.\n后面加数量词修饰则是重复\n选择的括号里面的字串。
eg:

    str = 'ababaabaa'
    console.log(str.match(/([a-z]).\1/g));  //['aba','aba']
    console.log(str.match(/([a-z]){2}.\1/g));  //['abab','aaba']
    console.log(str.match(/([a-z]){2}.\1{2}/g));  //[babaa]
    console.log(str.match(/([a-z]).\1{2}/g));  //['abaa']

进阶知识点

1. 零宽断言

  • 断言:俗话的断言就是“我断定什么什么”,而正则中的断言,就是说正则可以指明在指定的内容的前面或后面会出现满足指定规则的内容,意思正则也可以像人类那样断定什么什么,比如"ss1aa2bb3",正则可以用断言找出aa2前面有bb3,也可以找出aa2后面有ss1.
  • 零宽:就是没有宽度,在正则中,断言只是匹配位置,不占字符,也就是说,匹配结果里是不会返回断言本身。

2. 捕获和非捕获

3. 反向引用

4. 贪婪和非贪婪

5. 反义

示例

1.替换以“https:“开头以“:123:456“格式结尾的链接,此处需要注意排除掉中间有空格的匹配

let str = `lasdjflkj missing https://baidu.com.js at https://baidu.js:123:34 lsdjflksj(missing https://tecent.qq.com.js at https://tencent.qq.js:33:22)1123123`;
let newStr = str.replace(
          /(https:)([^\s]*?)(:\d{1,}:\d{1,})/g,
          "<span>$1$2$3</span>");
console.log(newStr);

2.匹配最后的字符串

给定字符串

<user>
    <user>
        <name>a</name>
    </user>
    <user>
        <name>a</name>
    </user>
</user>
<password>123</password>

要求拿到

<user>
    <user>
        <name>a</name>
    </user>
    <user>
        <name>a</name>
    </user>
</user>

也就是去掉最后一个</user>后面的字符串。

最后写出来的表达式是(?<=</user>)(?![\w\W]*</user>)[\w\W]+

参考:

js正则表达式(七)

《JavaScript 正则表达式迷你书》问世了!

想要在JS中把正则玩得飘逸,学会这几个函数的使用必不可少

一篇文章搞定 javascript 正则表达式

前端正则最全知识汇总(学会正则收藏它就够啦)

前端进阶高薪必看-正则篇

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

JS正则表达式语法大全(非常详细)

你是如何学会正则表达式的?

【干货】五分钟,正则表达式不再是你的烦恼

正则表达式30分钟入门教程

三十分钟包会——正则表达式

有了这个库,写正则表达式就像说话一样简单

有了这25个正则表达式,代码效率提高80%

正则匹配最后一个字符串 怎样使用正则匹配最后一个字符串详解