JS中的正则表达式

在计算机语言中,正则表达模式匹配是非常高效的字符串处理方式。我们在进行字符串处理的时候,比如表单校验、url参数获取、文本预编译处理,多端跨端转译等等,都少不了跟正则表达式打交道。但由于正则表达的语法规则比较抽象,如果平常不经常接触,一旦要用,就得好一番查找资料。但是网上的资料很多都太零散,为方便以后高效查看,略系统地整理如下。

一、什么是正则表达式

正则表达式(Regular Expression),是一串特殊的字符串,用来描述一组字符串的规律和规则。正则表达式可用于验证、检索、匹配、替换文本字符串。

二、正则表达式的简要发展史

  • 在对人类神经系统的早期研究中,科学家 Warren McCulloch 和 Walter Pitts 研究出了一种用数学方式来描述神经网络的新方法。
  • 1951年, 数学科学家 Stephen Kleene,在他的《神经网事件的表示法》的论文中,利用称之为正则集合的数学符号来描述上述模型,引入了正则表达式的概念。
  • 自此以后,正则表达式被广泛地应用到各种 UNIX 或类似于 UNIX 的工具中。
  • 正则表达式在各种计算机语言和应用领域得到了广大的应用和发展。

三、正则引擎

正则引擎可以让正则表达式得以工作。主流的正则引擎分为3类:

  • DFA:确定型有穷自动机(Deterministic finite automaton, DFA)
  • 传统型NFA:非确定型有穷自动机(Non-deterministic finite automaton, NFA)
  • POSIX NFA:由于DFA和传统型NFA这两种引擎产生了很多变体,为了规避不必要变体的继续产生,出台了POSIX

四 、正则表达式语法

正则表达式语法格式:

1
/pattern/flags

  • pattern部分由普通字符以及特殊字符(也被称为”元字符”)组成。
  • flags部分非必填

4.1 普通字符

没有显式指定为元字符的所有可打印和不可打印字符。包括所有大写和小写字母、所有数字、所有标点符号和一些其他符号。

4.2 特殊字符(元字符)

\

1
2
3
4
5
6
7
依照下列规则匹配:

在非特殊字符之前的反斜杠表示下一个字符是特殊字符,不能按照字面理解。例如,前面没有 "\" 的 "b" 通常匹配小写字母 "b",即字符会被作为字面理解,无论它出现在哪里。但如果前面加了 "\",它将不再匹配任何字符,而是表示一个字符边界。

在特殊字符之前的反斜杠表示下一个字符不是特殊字符,应该按照字面理解。详情请参阅下文中的 "转义(Escaping)" 部分。

如果你想将字符串传递给 RegExp 构造函数,不要忘记在字符串字面量中反斜杠是转义字符。所以为了在模式中添加一个反斜杠,你需要在字符串字面量中转义它。/[a-z]\s/i 和 new RegExp("[a-z]\\s", "i") 创建了相同的正则表达式:一个用于搜索后面紧跟着空白字符(\s 可看后文)并且在 a-z 范围内的任意字符的表达式。为了通过字符串字面量给 RegExp 构造函数创建包含反斜杠的表达式,你需要在字符串级别和正则表达式级别都对它进行转义。例如 /[a-z]:\\/i 和 new RegExp("[a-z]:\\\\","i") 会创建相同的表达式,即匹配类似 "C:\" 字符串。

^

1
2
3
4
匹配输入的开始。如果多行标志被设置为 true,那么也匹配换行符后紧跟的位置。

例如,/^A/ 并不会匹配 "an A" 中的 'A',但是会匹配 "An E" 中的 'A'。
当 '^' 作为第一个字符出现在一个字符集合模式时,它将会有不同的含义。反向字符集合 一节有详细介绍和示例。

$

1
2
3
匹配输入的结束。如果多行标志被设置为 true,那么也匹配换行符前的位置。

例如,/t$/ 并不会匹配 "eater" 中的 't',但是会匹配 "eat" 中的 't'。

*

1
2
3
匹配前一个表达式 0 次或多次。等价于 {0,}。

例如,/bo*/ 会匹配 "A ghost boooooed" 中的 'booooo' 和 "A bird warbled" 中的 'b',但是在 "A goat grunted" 中不会匹配任何内容。

+

1
2
3
匹配前面一个表达式 1 次或者多次。等价于 {1,}。

例如,/a+/ 会匹配 "candy" 中的 'a' 和 "caaaaaaandy" 中所有的 'a',但是在 "cndy" 中不会匹配任何内容。

?

1
2
3
4
5
6
7
匹配前面一个表达式 0 次或者 1 次。等价于 {0,1}。

例如,/e?le?/ 匹配 "angel" 中的 'el'、"angle" 中的 'le' 以及 "oslo' 中的 'l'。

如果紧跟在任何量词 *、 +、? 或 {} 的后面,将会使量词变为非贪婪(匹配尽量少的字符),和缺省使用的贪婪模式(匹配尽可能多的字符)正好相反。例如,对 "123abc" 使用 /\d+/ 将会匹配 "123",而使用 /\d+?/ 则只会匹配到 "1"。

还用于先行断言中,如本表的 x(?=y) 和 x(?!y) 条目所述。

.

1
2
3
4
5
(小数点)默认匹配除换行符之外的任何单个字符。

例如,/.n/ 将会匹配 "nay, an apple is on the tree" 中的 'an' 和 'on',但是不会匹配 'nay'。

如果 s ("dotAll") 标志位被设为 true,它也会匹配换行符。

(x)

1
2
3
像下面的例子展示的那样,它会匹配 'x' 并且记住匹配项。其中括号被称为捕获括号。

模式 /(foo) (bar) \1 \2/ 中的 '(foo)' 和 '(bar)' 匹配并记住字符串 "foo bar foo bar" 中前两个单词。模式中的 \1 和 \2 表示第一个和第二个被捕获括号匹配的子字符串,即 foo 和 bar,匹配了原字符串中的后两个单词。注意 \1、\2、...、\n 是用在正则表达式的匹配环节,详情可以参阅后文的 \n 条目。而在正则表达式的替换环节,则要使用像 $1、$2、...、$n 这样的语法,例如,'bar foo'.replace(/(...) (...)/, '$2 $1')。$& 表示整个用于匹配的原字符串。

(?:x)

1
2
3
匹配 'x' 但是不记住匹配项。这种括号叫作非捕获括号,使得你能够定义与正则表达式运算符一起使用的子表达式。

看看这个例子 /(?:foo){1,2}/。如果表达式是 /foo{1,2}/,{1,2} 将只应用于 'foo' 的最后一个字符 'o'。如果使用非捕获括号,则 {1,2} 会应用于整个 'foo' 单词。更多信息,可以参阅下文的 Using parentheses 条目。

x(?=y)

1
2
3
匹配'x'仅仅当'x'后面跟着'y'.这种叫做先行断言。

例如,/Jack(?=Sprat)/会匹配到'Jack'仅当它后面跟着'Sprat'。/Jack(?=Sprat|Frost)/匹配‘Jack’仅当它后面跟着'Sprat'或者是‘Frost’。但是‘Sprat’和‘Frost’都不是匹配结果的一部分。

(?<=y)x

1
2
3
匹配'x'仅当'x'前面是'y'.这种叫做后行断言。

例如,/(?<=Jack)Sprat/会匹配到' Sprat '仅仅当它前面是' Jack '。/(?<=Jack|Tom)Sprat/匹配‘Sprat ’仅仅当它前面是'Jack'或者是‘Tom’。但是‘Jack’和‘Tom’都不是匹配结果的一部分。

x(?!y)

1
2
3
仅仅当'x'后面不跟着'y'时匹配'x',这被称为正向否定查找。

例如,仅仅当这个数字后面没有跟小数点的时候,/\d+(?!\.)/ 匹配一个数字。正则表达式/\d+(?!\.)/.exec("3.141") 匹配‘141’而不是‘3.141’

(?<!y)x

1
2
3
4
5
仅仅当'x'前面不是'y'时匹配'x',这被称为反向否定查找。

例如,仅仅当这个数字前面没有负号的时候,/(?<!-)\d+/ 匹配一个数字。
/(?<!-)\d+/.exec('3') 匹配到 "3".
/(?<!-)\d+/.exec('-3') 因为这个数字前有负号,所以没有匹配到。

x|y

1
2
3
匹配‘x’或者‘y’。

例如,/green|red/匹配“green apple”中的‘green’和“red apple”中的‘red’

{n}

1
2
3
n 是一个正整数,匹配了前面一个字符刚好出现了 n 次。

比如, /a{2}/ 不会匹配“candy”中的'a',但是会匹配“caandy”中所有的 a,以及“caaandy”中的前两个'a'。

{n,}

1
2
3
n 是一个正整数,匹配前一个字符至少出现了 n 次。

例如,/a{2,}/ 匹配 "aa", "aaaa" 和 "aaaaa" 但是不匹配 "a"。

{n,m}

1
2
3
n 和 m 都是整数。匹配前面的字符至少 n 次,最多 m 次。如果 n 或者 m 的值是 0,这个值被忽略。

例如,/a{1, 3}/ 并不匹配“cndy”中的任意字符,匹配“candy”中的 a,匹配“caandy”中的前两个 a,也匹配“caaaaaaandy”中的前三个 a。注意,当匹配”caaaaaaandy“时,匹配的值是“aaa”,即使原始的字符串中有更多的 a。

[xyz]

1
2
3
4
5
一个字符集合。匹配方括号中的任意字符,包括转义序列。

你可以使用破折号(-)来指定一个字符范围。对于点(.)和星号(*)这样的特殊符号在一个字符集中没有特殊的意义。他们不必进行转义,不过转义也是起作用的。

例如,[abcd] 和 [a-d] 是一样的。他们都匹配"brisket"中的‘b’,也都匹配“city”中的‘c’。/[a-z.]+/ 和/[\w.]+/与字符串“test.i.ng”匹配。

[^xyz]

1
2
3
4
一个反向字符集。也就是说, 它匹配任何没有包含在方括号中的字符。

你可以使用破折号(-)来指定一个字符范围。任何普通字符在这里都是起作用的。
例如,[^abc] 和 [^a-c] 是一样的。他们匹配"brisket"中的‘r’,也匹配“chop”中的‘h’。

[\b]

1
匹配一个退格 (U+0008)。(不要和\b混淆了。)

\b

1
2
3
4
5
6
7
8
9
匹配一个词的边界。一个词的边界就是一个词不被另外一个“字”字符跟随的位置或者前面跟其他“字”字符的位置,例如在字母和空格之间。注意,匹配中不包括匹配的字边界。换句话说,一个匹配的词的边界的内容的长度是 0。(不要和 [\b] 混淆了)

使用"moon"举例:
/\bm/匹配“moon”中的‘m’;
/oo\b/并不匹配"moon"中的'oo',因为'oo'被一个“字”字符'n'紧跟着。
/oon\b/匹配"moon"中的'oon',因为'oon'是这个字符串的结束部分。这样他没有被一个“字”字符紧跟着。
/\w\b\w/将不能匹配任何字符串,因为在一个单词中间的字符永远也不可能同时满足没有“字”字符跟随和有“字”字符跟随两种情况。

备注: JavaScript 的正则表达式引擎将特定的字符集定义为“字”字符。不在该集合中的任何字符都被认为是一个断词。这组字符相当有限:它只包括大写和小写的罗马字母,十进制数字和下划线字符。不幸的是,重要的字符,例如“é”或“ü”,被视为断词。

\B

1
2
3
4
5
6
7
8
9
匹配一个非单词边界。匹配如下几种情况:

字符串第一个字符为非“字”字符
字符串最后一个字符为非“字”字符
两个单词字符之间
两个非单词字符之间
空字符串

例如,/\B../匹配"noonday"中的'oo', 而/y\B../匹配"possibly yesterday"中的’yes‘

\cX

1
2
3
当 X 是处于 A 到 Z 之间的字符的时候,匹配字符串中的一个控制符。

例如,/\cM/ 匹配字符串中的 control-M (U+000D)。

\d

1
2
3
匹配一个数字。等价于 [0-9]。

例如, /\d/ 或者 /[0-9]/ 匹配"B2 is the suite number."中的'2'。

\D

1
2
3
匹配一个非数字字符。等价于 [^0-9]。

例如, /\D/ 或者 /[^0-9]/ 匹配"B2 is the suite number."中的'B' 。

\f

1
匹配一个换页符 (U+000C)。

\n

1
匹配一个换行符 (U+000A)。

\r

1
匹配一个回车符 (U+000D)。

\s

1
2
3
4
5
匹配一个空白字符,包括空格、制表符、换页符和换行符。等价于 [\f\n\r\t\v\u0020\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]。

例如,/\s\w*/ 匹配"foo bar."中的' bar'。

经测试,\s不匹配"\u180e",在当前版本 Chrome(v80.0.3987.122) 和 Firefox(76.0.1) 控制台输入/\s/.test("\u180e") 均返回 false。

\S

1
2
3
匹配一个非空白字符。等价于 [^\f\n\r\t\v\u0020\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]。

例如,/\S\w*/ 匹配"foo bar."中的'foo'。

\t

1
匹配一个水平制表符 (U+0009)。

\v

1
匹配一个垂直制表符 (U+000B)。

\w

1
2
3
匹配一个单字字符(字母、数字或者下划线)。等价于 [A-Za-z0-9_]。

例如,/\w/ 匹配 "apple," 中的 'a',"$5.28,"中的 '5' 和 "3D." 中的 '3'。

\W

1
2
3
匹配一个非单字字符。等价于 [^A-Za-z0-9_]。

例如,/\W/ 或者 /[^A-Za-z0-9_]/ 匹配 "50%." 中的 '%'。

\n

1
2
3
在正则表达式中,它返回最后的第 n 个子捕获匹配的子字符串 (捕获的数目以左括号计数)。

比如 /apple(,)\sorange\1/ 匹配"apple, orange, cherry, peach."中的'apple, orange,' 。

\0

1
匹配 NULL(U+0000)字符,不要在这后面跟其他小数,因为 \0<digits> 是一个八进制转义序列。

\xhh

1
匹配一个两位十六进制数(\x00-\xFF)表示的字符。

\uhhhh

1
匹配一个四位十六进制数表示的 UTF-16 代码单元。

\u{hhhh}或\u{hhhhh}

1
(仅当设置了 u 标志时)匹配一个十六进制数表示的 Unicode 字符。

4.3 flags

正则表达式有六个可选参数 (flags) 允许全局和不分大小写搜索等。这些参数既可以单独使用也能以任意顺序一起使用,并且被包含在正则表达式实例中。

1
2
3
4
5
6
g	全局搜索。
i 不区分大小写搜索。
m 多行搜索。
s 允许 . 匹配换行符。
u 使用 unicode 码的模式进行匹配。
y 执行“粘性 (sticky)”搜索,匹配从目标字符串的当前位置开始。

JavaScript中正则表达式的使用方法

exec

在字符串中执行查找匹配,返回一个数组(未匹配到则返回 null)。【RegExp 方法】

1
2
var myRe = /d(b+)d/g;
var myArray = myRe.exec("cdbbdbsbz");

1
2
var myRe = new RegExp("d(b+)d", "g");
var myArray = myRe.exec("cdbbdbsbz");

test

在字符串中测试是否匹配,返回 true 或 false。【RegExp 方法】

1
2
3
var str='abcdef';
var re=/b/;
alert(re.test(str));

match

在字符串中执行查找匹配,返回一个数组,在未匹配到时会返回 null。【String 方法】

1
2
3
4
5
6
var re = /\w+\s/g;
var str = "fee fi fo fum";
var myArray = str.match(re);
console.log(myArray);

// ["fee ", "fi ", "fo "]

matchAll

在字符串中执行查找所有匹配,返回一个迭代器(iterator)。【String 方法】

1
2
3
4
5
6
7
8
9
const str = 'hello javascript hello css';
console.log(...str.matchAll(/hello/g));
// [0: "hello", groups: undefined, index: 0, input: "hello javascript hello css"]
// [0: "hello", groups: undefined, index: 17, input: "hello javascript hello css"]

// 0: "hello" 匹配的字符串,如果有使用分组会在后面依次列出来
// groups: undefined 没有使用命名捕获组会返回undefined,否则会返回包含命名捕获组的对象
// index: 0 匹配的结果在当前字符串位置开始的索引
// input: "hello javascript hello css" 当前字符串

在字符串中测试匹配,返回匹配到的位置索引,或者在失败时返回 -1。【String 方法】

1
2
3
4
5
6
7
8
var str="abcdef";
var re=/b/;
alert(str.search(re));
//返回1
var re=/w/;
//返回-1
var re=/B/;
//返回-1

replace

在字符串中执行查找匹配,并且使用替换字符串替换掉匹配到的子字符串。【String 方法】

1
2
3
4
var re = /(\w+)\s(\w+)/;
var str = "John Smith";
var newstr = str.replace(re, "$2, $1");
console.log(newstr);

split

使用正则表达式或者一个固定字符串分隔一个字符串,并将分隔后的子字符串存储到数组中。【String 方法】

1
2
3
var str="How are you doing today?";
var n=str.split(/a/);
// 返回['How ', 're you doing tod', 'y?']

参考资料