正则表达式学习笔记

正则表达式对于我来讲一直像黑暗魔法同样的存在。手机正则去网上搜，邮箱正则去网上搜，复杂点的看看文档拼凑一下，再复杂只能厚着脸皮让其余同事给写一个。历来没有系统的学习过，今天准备拿下它。

1. 学习目标：

1. 了解正则表达式语法
2. 在IDE中使用正则表达式
3. 在javascript 中使用正则表达式处理字符串

2. 什么是正则表达式

正则表达式，又称正规表示式、正规表示法、正规表达式、规则表达式、常规表示法（英语：Regular Expression，在代码中常简写为regex、regexp或RE），计算机科学的一个概念。正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串。在不少文本编辑器里，正则表达式一般被用来检索、替换那些匹配某个模式的文本。

通俗的讲就是按照某种规则去匹配符合条件的字符串

3.利用图形化工具理解正则表达式

辅助理解正则表达的在线工具 regexper.com/ 咱们利用这个工具辅助理解，正则表达式。语法没懂表着急，后面会有，这里只是学会用工具帮助咱们学习。

手机号正则

/^1[34578][0-9]{9}$/

手机号正则表达式

注释：以1开头，第二位为3 4 5 7 9 其中一个，以9位（自己1次加剧复8次）0-9数字结尾

单词边界

/\bis\b/

注释： is先后都是单词的边界，比较晦涩难懂？感觉下二者的区别，\b 会方道语法部分讲解

URL分组替换

/http:(\/\/.+\.jpg)/

看不懂的不要慌语法部分后面会有介绍，这里只是展现利用可视化的图形帮助咱们理解正则表达式，能够回来再看木有关系

正则表达式中括号用来分组，这个时候咱们能够经过用$1来获取 group#1的内容

说下这个正则的意义，若是网站用了https，网站引用静态资源也必须是https，不然报错。若是写成 // 会自动识别 http 或者 https

日期匹配与分组替换

/^\d{4}[/-]\d{2}[/-]\d{2}$/

这个正则比较复杂，画符念咒的地方太多了，一一分析：

1. Start of line 是由^生效的表示以此开头
2. 对应结尾End of line 由$生效表示以此结尾
3. 接着看digit 由 \d 生效表示数字
4. 3times 由{4} 生效表示重复4次，开始的时候有疑问，为何不是 4times 。后来明白做者的用意，正则表达式是一个规则，用这个规则去从字符串开始匹配到结束（注意计算机读字符串但是不会分行的，都是一个串，咱们看到的多行，人家会认为是个 \t ）这里设计好像小火车的轨道一直开到末尾。digit 传过一次，3times表示再来三次循环，共4次，后面的once同理。 本身被本身啰嗦到了。
5. 接下来，是 one of 在手机正则里面已经出现了。表示什么都行。只要符合这两个都让经过。

好了这个正则解释完了，接下来用它作什么呢？

咱们能够验证日期的合法性

结合URL分组替换所用到的分组特性，咱们能够轻松写出日期格式化的方法

改造下这个正则

/^(\d{4})[/-](\d{2})[/-](\d{2})$/

轻松的能够拿到 group#1 #2 #3 的内容，对应 $1 $2 $3

到如今已经能结合图形化工具看懂正则表达式表达式了，若是想本身写，还要在正则语法上下点功夫

4. Js中Regexp对象

Javascript 经过内置对象RegExp支持正则表达式，有两种方法实例化RegExp对象

字面量方法

const reg =/\bis\b/g

构造函数

const reg = new RegExp('\\bis\\b', 'g')

注意：第一个参数为正则表达式字符串（注意转译），第二个参数为修饰符，修饰符g表明全局搜索，后面会有详细介绍。

5. 正则表达式语法

1 修饰符 （三个 g i m）

修饰符与其余语法特殊，字面量方法声名的时候放到//后，构造函数声明的时候，做为第二个参数传入。整个正则表达式能够理解为正则表达式规则字符串+修饰符

• g：global 执行一个全局匹配
• i：ignore case执行一个不区分大小写的匹配
• m: multiple lines多行匹配

修饰符能够一块儿用 const reg =/\bis\b/gim

来讲说他们有什么做用

有g和没有g的区别

没有g只替换了第一个，有g 全部的都换了

有i和没有i的区别

有i忽略大小写，没有i严格区分大小写

2 元字符

正则表达式由两种基本字符组成：

• 原义字符
• 非打印字符
• 元字符 (* + ? $ ^ . | \ ( ) { } [ ])

3. 原义字符

这个没什么好解释的，咱们一直在举例的 /is/ 匹配字符串'is'

\将下一个字符标记为一个特殊字符、或一个原义字符、或一个向后引用、或一个八进制转义符。例如，n”匹配字符“n”。“\n”匹配一个换行符。序列“\\”匹配“\”而“\(”则匹配“(”。

4. 非打印字符

字符	描述
\cx	匹配由x指明的控制字符。例如， \cM 匹配一个 Control-M 或回车符。x 的值必须为 A-Z 或 a-z 之一。不然，将 c 视为一个原义的 'c' 字符。
\f	匹配一个换页符。等价于 \x0c 和 \cL。
\n	匹配一个换行符。等价于 \x0a 和 \cJ。
\r	匹配一个回车符。等价于 \x0d 和 \cM。
\s	匹配任何空白字符，包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。
\S	匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。
\t	匹配一个制表符。等价于 \x09 和 \cI。
\v	匹配一个垂直制表符。等价于 \x0b 和 \cK。

非打印字符，以\n为例

其余的在前端引用比较少，应该在后端处理文本文件的时候会用到

5. 字符类 []

在前面的手机号正则例子🌰中，咱们已经使用过[] /^1[34578][0-9]{9}$/ : [34578]表示34578任意一个数字便可。在日期匹配与分组替换例子🌰中 /^\d{4}[/-]\d{2}[/-]\d{2}$/ 表示符合 ／ - 均可以

6. 字符类取反 [^]

表示不属于此类

空格也不属于，好多狗🐶

7. 范围类[-]

正则表达式支持必定范围规则好比 [a-z] [A-Z] [0-9] 能够连写[a-z0-9] 若是你只是想匹配-在 范围类最后加-便可。请看实例。

8. 预约义类

经常使用为了方便书写

字符	等价类	含义
.	[^\n\r]	除了回车符和换行符以外的全部字符
\d	[0-9]	数字字符
\D	[^0-9]	非数字字符
\s	[\t\n\x0B\f\r]	空白符
\S	[^\t\n\x0B\f\r]	非空白符
\w	[a-zA-Z_0-9]	单词字符（字母、数字、下划线）
\W	[^a-zA-Z_0-9]	非单词字符

有了这些预约义类，写一些正则就很方便了，好比咱们但愿匹配一个 ab+数字+任意字符 的字符串，就能够这样写了 /ab\d./

9. 边界

字符	含义
^	以xx开头
$	以xx结尾
\b	单词边界，指[a-zA-Z_0-9]以外的字符
\B	非单词边界

边界顾名思义即定义匹配的边界条件，上面基本都在前面的例子碰到了，这里演示下\b与\B 的区别

10. 量词

字符	含义
?	出现零次或一次
*	出现零次或屡次(任意次)
+	出现一次或屡次（至道一次）
{n}	对应零次或者n次
{n,m}	至少出现n次但不超过m次
{n,}	至少出现n次(+的升级版)
{0,n}	至多出现n次(其实就是{n,m} 方便记忆而已)

若是没有量词，要匹配4位数字这样写就能够/\d\d\d\d/, 若是匹配50位100位呢？那不是要疯掉了？
有了量词，就能够这样写/\d{100}/, 量词的使用咱们在手机号中使用过，表如今可视化中就是循环多少次。

凑一个上面都包含的实例/\d?@\d*@\d+@\d{10}@\d{10,20}@\d{10,}@\d{0,10}/

11.贪婪与懒惰（非贪婪）

正则表达式默认会匹配贪婪模式，什么是贪婪模式呢？如其名尽量多的匹配。咱们看个例子🌰。

/\d{3,6}/

贪婪模式下，匹配的了最多的状况。

与贪婪对应就是懒惰模式，懒惰对应的就是匹配的尽量少的状况。如何开启懒惰模式？ 在量词后面加?。继续上面的例子

/\d{3,6}?/

若是想知道，正则表达式是如何匹配量词的，请看 进阶正则表达式 文中有介绍，正则是如何回溯的。

12.分组与反向引用

分组，又称为子表达式。把正则表达式拆分红小表达式。概念枯燥，说个例子为嘛用分组：

不分组 /abc{2}/

量词仅做用到最后的c

分组 /(abc){2}/

注意这里 group #1

分组虽然和运算符() 很像，可是分组在正则表达式中，注意理解组的含义。常常有人滥用分组

/^(http|https)/ 真的须要这样么？其实 /^https?/就能够了，你正则写的特别长的时候，会出现一堆没用的结果，看着都头疼吧。

分组每每和反向引用一块儿使用，别被概念吓到：当一个正则表达式被分组后，每一个分组自动被赋予一个组号，一左到右分别是 $1 $2…

再把以前的例子拿出来

/^(\d{4})[/-](\d{2})[/-](\d{2})$/

轻松的能够拿到 group#1 #2 #3 的内容，对应 $1 $2 $3

若是在反向引用中不想捕获年该如何操做? 加上 ?:便可

/^(?:\d{4})[/-](\d{2})[/-](\d{2})$/

12.前瞻

⚠️ 这部分为进阶部分—选看

正则表达式中有前瞻（Lookahead）和后顾（Lookbehind）的概念，这两个术语很是形象的描述了正则引擎的匹配行为。须要注意一点，正则表达式中的前和后和咱们通常理解的先后有点不一样。一段文本，咱们通常习惯把文本开头的方向称做“前面”，文本末尾方向称为“后面”。可是对于正则表达式引擎来讲，由于它是从文本头部向尾部开始解析的（能够经过正则选项控制解析方向），所以对于文本尾部方向，称为“前”，由于这个时候，正则引擎还没走到那块，而对文本头部方向，则称为“后”，由于正则引擎已经走过了那一块地方。

⚠️注意：后顾性能损耗比较大，js只支持前瞻（知乎上看到的，具体缘由不详）

上面的比较概念话，尝试用大白话讲讲，就说皇上选妃吧，先行条件得是美女吧，长得“如花”那样皇上可不要，漂亮这关过了，皇上想要这个美女也不行，皇室有规矩，必须是贵族血统。

那么“漂亮”就是正常的匹配，匹配到了，还得看看家室是否是贵族。"贵族"至关于前瞻条件

前瞻分两种一种是正向前瞻(?=xxx), 另外一种是负向前瞻(?!xxx)

😂 是否是很简单？那咱们来玩个好玩的。

题目：如何将'123456'转成货币带逗号的。'123,456'。这个是很常规格式化金额的需求。

若是在没有学习正则以前，个人思路是：

1. 字符串转数组
2. 反转数组
3. 每隔三个添加个逗号
4. 添加完了反转数组
5. 数组转字符串

好累～～～

今天学习了正则，能够一步到位 '123456789'.replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')

到此为止正则的基本使用已经结束，后面一篇会分享一些正则的 「奇技淫巧」