JS 正则表达式

推荐一篇好文章：JS正则表达式完整教程(略长)

正则表达式概述

概念：按照一定的规则，查找和替换字符串
执行原理：通过 [参数字符串] 设置检索规则，在 [指定字符串] 中检索符合规则的字符串
作用：用来进行文本搜索和文本替换

正则表达式的基本语法

语法：/正则表达式/修饰符(可选)
例：let abc_reg = /abc/gi ==> ABC aBc abC...
其中：

• /abc/gi 是一个正则表达式
• abc 是这个正则表达式的主体，表示的是要检索的内容是 abc
• g, i 是正则表达式的修饰符。g 表示全局检索、i 表示不区分大小写。

正则表达式的常见用法

1. search 方法
   用于检索与正则表达式相匹配的子字符串，并返回子字符串的起始位置。
2. match 方法
   用于检索与正则表达式相匹配的子字符串，并返回一个或者多个的正则匹配。
3. replace 方法
   用于在指定字符串中，用一个字符串替换一个与正则表达式相匹配的子字符串。

正则表达式进阶

1. 修饰符

修饰符是正则表达式进行字符串检索时 [检索规则] 的制定者之一。即：修饰符规定了正则应该按照何种方式进行检索。常见的修饰符类型有两种：i, g

• i : 表示正则检索内容时不区分大小写
• g : 表示 正则检索内容时采用全局匹配，而不是找到第一个就停止。

2. 检索模式

用于指定正则采用何种方式进行内容的检索，它们不互相独立，而是相辅相成，就像修饰符可以多个一起使用一样。

1. 表达式模式

常见的表达式模式有以下三种：

• [abc]
  在指定字符串中检索，查找任何满足存在于[方括号中]规则的字符。例：

        let str  = "123abc1|||k23ABC;"
        console.log(str.match(/[abc]/gi));
        console.log(str.replace(/[abc]/gi,"(R)"));

只要存在于[]之间的都会被查找出和替换

• [0-9]
  匹配任何从 0 至 9 的数字，同理还有：[a-z]（匹配 a-z 之间的字母），[A-Z]（匹配 A-Z 之间的字母）[a-zA-Z] （匹配 a-z 或者 A-Z 之间的字母）
  查找的范围是根据起始字符的 ASCII 码 到 结束字符的 ASCII 码。
  例：

        let str  = "123abc1|||k23ABC;"
        console.log(str.match(/[0-2]/gi));
        console.log(str.replace(/[a-zA-Z]/gi,"(R)"));

0-2之间的数字都被找出，a-zA-Z的字符都被替换

• (123|abc)
  匹配任何以 | 分割的字符
  例：

        let str  = "123abc1|||k23ABC;"
        console.log(str.match(/(123|abc)/gi));
        console.log(str.replace(/(123|abc)/gi,"(R)"));

123 和 abc 不区分大小写被整段找出和替换

2. 元字符模式

具有特殊含义的字符称为元字符。
常见的元字符有以下几种：

• \w
  \w 用于匹配字母，数字，下划线 [这三者统称单词]（注：\W 匹配除了字母，数字，下划线）。例如：

        let str = "abc123 _|[]MABC*dad 123lda123abc";
        console.log(str.match(/\w/g));
        console.log(str.match(/\W/g));
        console.log(str.match(/[a-z]\w/g));
        console.log(str.match(/[a-z]\W/g));

\w 将所有数字字母下划线都找出，\W 将所有非数字字母下划线找出，[a-z]\w 将第一个是a-z 第二个是数字字母或下划线的字符串找出，[a-z]\W 将第一个是a-z 第二个是非数字字母或下划线的字符串找出

• \d
  \d 匹配任何是 数字 的字符（注：\D 匹配除数字以外）。例如：

        let str = "abc123 _|[]MABC*dad 123lda123abc";
        console.log(str.match(/\d/g));
        console.log(str.match(/\D/g));
        console.log(str.match(/[a-z]\d/g));
        console.log(str.match(/[a-z]\D/g));

\d 匹配所有数字，\D 匹配所有非数字，[a-z]\d 匹配第一个字符是a-z的字母 第二个字符是数字的字符串，[a-z]\D 匹配的是第一个字符是a-z的字母 第二个字符是非数字的字符串

• \s
  \s 匹配任何是 空白 的字符（注：\S 匹配除了空白字符）。例如：

        let str = "abc123 _|[]MABC*dad 123lda123abc";
        console.log(str.match(/\s/g));
        console.log(str.match(/\S/g));
        console.log(str.match(/[a-z]\s/g));
        console.log(str.match(/[a-z]\S/g));

\s 匹配所有空白字符，\S 匹配所有非空白字符，[a-z]\s 匹配第一个字符是a-z的字母 第二个字符是空白字符的字符串，[a-z]\S 匹配的是第一个字符是a-z的字母 第二个字符是非空白字符的字符串

• \b
  \b 在指定字符串中检索，匹配任何是 单词边界 规则的字符或字符串。（注：\B 匹配非单词边界）。如何理解单词边界呢？
  上面可以知道 \w 匹配的数字字母下划线统称单词，那么 \W 对应的就是非单词了，进而 \w 和 \W 之间就是 单词边界 了。
  如果需要更精确的说法，就是 \b 匹配这样的位置：它的前一个字符和后一个字符不全是 \w。比如：hello world, 'h' 占一个位置，'e' 占一个位置，这个位置是显示可见的，但所有的单个字符（包括不可见的空白字符）都会占一个位置。注意，字符与字符之间还有一个位置，即 ‘h' , 'e' 之间还有一个（什么都看不见）的位置，甚至 'h' 之前，'d' 之后还有这么一个隐藏的位置。这个隐藏的位置就和 \b 有关。

即：隐藏的位置 \b 匹配的是上一个显示位置 和 下一个显示位置的字符不全是 \w(单词)
例如：

        let str = "hello world";
        console.log(str.replace(/\b/g,"#"));
        console.log(str.replace(/\B/g,"#"));

符合条件的隐式位置被替换成了 # ，使用 \B 则完全相反

再看一个例子：

        let str = "abc123 _|[]MABC*dad 123abc*123abc";
        console.log(str);
        console.log(str.replace(/\babc/ig,"(R)"));
        console.log(str.replace(/abc\b/ig,"(R)"));
        console.log(str.replace(/[0-9]\b/ig,"(R)"));
        console.log(str.replace(/\b[0-9]/ig,"(R)"));

可以这样理解，\b 在 abc 和 [0-9] 之前，即找出在abc 和 [0-9] 之前的那么一个隐式位置，然后将后面的 abc 或 [0-9] 替换。\b 在之后也是同理

3. 量词模式

表示要检索的字符或字符串出现的次数的词组称为量词。
如果用 n 表示要检索的字符或者字符串，那么常见的量词模式有：

• n+ : 在原字符串中检索任何 [包含一个或者多个 n] 的子字符串
• n* : 在原字符串中检索任何 [包含 0 个或者多个 n] 的子字符串
• n? : 在原字符串中检索任何 [包含 0 个或者 1 个 n] 的子字符串，即判断该子串是否存在原字符串

        let str = "abcccc123 _|[]MABC*dad 123ab*123abc";
        console.log(str);
        console.log(str.match(/abc+/ig));
        console.log(str.match(/abc*/ig));
        console.log(str.match(/abc?/ig));

+ 号 表示至少有一个 c , * 号 表示 0 个或者多个, ? 号 表示 0 个或者 1 个

4. RegExp 对象

上面提到正则表达式的基本语法是 /正则表达式/修饰符(可选)，这种创建正则的方法我们称为 [字面量创建正则表达式]。实际上 JS 也为正则提供了一个构造函数 RegExp，我们可以通过这个构造函数来生成一个正则表达式实例，这种创建正则的方式我们称为 [构造函数创建正则表达式]。
语法：let regExp = new RegExp("正则表达式", "修饰符")

注：通过构造函数方式创建的正则，参数均采用字符串声明

• test 方法，用来判断在【指定字符串】中是否存在满足【正则表达式规则】的【子字符串】。存在就返回 true，反之返回 false
  语法：正则表达式.test(指定字符串)
  类似于：指定字符串.match(正则表达式)
• exec 方法，查找在 【指定字符串中】【第一个】满足【正则表达式规则】的子字符串出现的【下标】和【内容】
  语法：正则表达式.exec(指定字符串)
  例子：

        let str = "ab123ABCccdawdab32";
        let regExp = new RegExp("abc?","gi");
        console.log(regExp.test(str));
        console.log(regExp.exec(str));

正则表达式高级

1. 检索模式的 ^ 和 $ 字符

• 初位字符 ^: 表示判断字符串以某个内容开始（匹配开头是什么内容）
• 末位字符 $: 表示判断字符串以某个内容结束（匹配结尾是什么内容）
  例子：

        let str = "abcn123dabc.com";
        console.log(str.replace(/^abc/g,"(R)"));
        console.log(str.replace(/.com$/g,"(R)"));
        console.log(str.replace(/(^abc)|(.com$)/g,"(R)"));

2. 重复类

重复类就类似与上面说的量词，用 { } 进行检索的一种模式称谓，{ } 用来匹配符合正则要求的字符连续出现的次数。

subStr{n}: 想要检索的内容出现了恰好 n 次
subStr{n,}: 想要检索的内容至少出现了 n 次，类似上面量词的 n+
subStr{m,n}: 想要检索的内容至少出现了 m 次，至多出现了 n 次

即：{0,1} 等价于 ? ; {1, } 等价于 + ; {0, } 等价于 *

3. 贪婪模式 和 懒惰模式

它们并不属于之前任何一种检索模式，但是它们是在此之上隐形产生的，例如

n* 就是贪婪模式， 只要符合正则要求就一直往下匹配
n? 就是懒惰模式，只要一匹配到符合正则的要求就立即结束

常见的懒惰模式：+ * {n} {n,} {n,m}
常见的贪婪模式：+? *? {n}? {n,}? {n,m}?

4. 脱字符 [^]

脱字符用在正则表达式的中括号里，表示匹配除了中括号里的。当前仅当 ^ 出现在中括号首位时，我们称 ^ 为脱字符

例：

        let str = "ab()c123abc";
        console.log(str.replace(/[^abc]/g,"(R)"));
        console.log(str.replace(/[^(abc)]/g,"(R)"));