JavaScript 正则表达式

JavaScript 中的正则表达式（RegExp）是一个描述字符模式的对象。它可以包含字母、数字以及特殊字符。此外，正则表达式模式可以包含单个或多个字符。

在 JavaScript 中构建正则表达式的两种方式：

使用 RegExp() 构造函数。
使用正则表达式字面量。

语法

正则表达式可以通过 RegExp() 构造函数定义如下：

var pattern = new RegExp(pattern, attributes);

或者简单地写成：

var pattern = /pattern/attributes;

参数

以下是参数的描述：

pattern：指定正则表达式的模式或另一个正则表达式。
attributes：可选字符串，包含 "g"（全局匹配）、"i"（不区分大小写）、"m"（多行匹配）中的任意一个或多个属性。

在我们学习正则表达式的例子之前，让我们先了解一下正则表达式的修饰符、量词、字面字符等。

修饰符

有几个修饰符可以使您处理正则表达式的方式简化，如大小写敏感性、多行搜索等。

Sr.No.	修饰符 & 描述
1	i
	执行不区分大小写的匹配。
2	m
	指定如果字符串包含换行或回车字符，则 ^ 和 $ 运算符将匹配换行边界，而非字符串边界。
3	g
	执行全局匹配，即找到所有匹配项而不是在第一个匹配项后停止。

方括号

方括号 ([]) 在正则表达式的上下文中具有特殊意义。它们用于查找一系列字符。

Sr.No.	表达式 & 描述
1	[...]
	方括号内的任何一个字符。
2	[^...]
	非方括号内的任何一个字符。
3	[0-9]
	匹配 0 到 9 之间的任何一个十进制数字。
4	[a-z]
	匹配小写字母 a 到 z 之间的任何一个字符。
5	[A-Z]
	匹配大写字母 A 到 Z 之间的任何一个字符。
6	[a-Z]
	匹配小写字母 a 到大写字母 Z 之间的任何一个字符。

上述范围是通用的；您也可以使用 [0-3] 匹配 0 到 3 之间的任何一个十进制数字，或者使用 [b-v] 匹配 b 到 v 之间的任何一个小写字母。

量词

使用一个特殊字符可以表示括号内字符序列和单一字符的频率或位置。每个特殊字符都有特定的含义。+, *, ?, 和 $ 标志都跟随在一个字符序列之后。

Sr.No.	表达式 & 描述
1	p+
	匹配包含一个或多个 p 的任何字符串。
2	p*
	匹配包含零个或多个 p 的任何字符串。
3	p?
	匹配包含最多一个 p 的任何字符串。
4	p{N}
	匹配包含 N 个 p 的任何字符串。
5	p{2,3}
	匹配包含两个或三个 p 的任何字符串。
6	p{2, }
	匹配包含至少两个 p 的任何字符串。
7	p$
	匹配以 p 结尾的任何字符串。
8	^p
	匹配以 p 开始的任何字符串。
9	?!p
	匹配不被字符串 p 跟随的任何字符串。

示例

以下示例解释了更多关于匹配字符的信息。

Sr.No.	表达式 & 描述
1	[^a-zA-Z]
	匹配不含 a 到 z 或 A 到 Z 之间任何字符的任何字符串。
2	p.p
	匹配包含 p，后面跟着任意字符，再跟着另一个 p 的任何字符串。
3	^.{$
	匹配包含正好两个字符的任何字符串。
4	*(.)**
	匹配位于和之间的任何字符串。
5	p(hp)
	匹配包含一个 p 后跟零个或多个 hp 序列的任何字符串。

字面字符

可以在正则表达式中使用反斜杠 () 加上字面字符。它们用于在正则表达式中插入特殊字符，如制表符、空字符、Unicode 等。

Sr.No.	字符 & 描述
1	Alphanumeric
	字母数字字符本身。
2	\0
	NUL 字符 (\u0000)。
3	\t
	制表符 (\u0009)。
4	\n
	换行 (\u000A)。
5	\v
	垂直制表符 (\u000B)。
6	\f
	换页 (\u000C)。
7	\r
	回车 (\u000D)。
8	\xnn
	由十六进制数 nn 指定的拉丁字符；例如，\x0A 与 \n 相同。
9	\uxxxx
	由十六进制数 xxxx 指定的 Unicode 字符；例如，\u0009 与 \t 相同。
10	\cX
	控制字符 ^X；例如，\cJ 等同于换行符 \n。

元字符

元字符是一个前面带有反斜杠的字母字符，它具有特殊的含义。

例如，您可以使用 '\d' 元字符来搜索一大笔钱：/([\d]+)000/，这里 \d 将搜索任何数字字符的字符串。

下表列出了一组可用于 PERL 风格正则表达式中的元字符。

Sr.No.	字符 & 描述
1	.
	单个字符。
2	\s
	空白字符（空格、制表符、换行）。
3	\S
	非空白字符。
4	\d
	数字（0-9）。
5	\D
	非数字。
6	\w
	字符（a-z, A-Z, 0-9, _）。
7	\W
	非字符。
8	[\b]
	字面退格（特殊情况）。
9	[aeiou]
	匹配给定集中的单个字符。
10	[^aeiou]
	匹配不在给定集中的单个字符。
11	**(foo
	匹配任何指定的替代选项。

创建正则表达式示例

let exp = /tutorialspoint/i;
// /tutorialspoint/ – 它查找 'tutorialspoint' 字符串的匹配项。
// i – 它在匹配模式与字符串时忽略字符的大小写。因此，它可以匹配 'TutoiralsPoint' 或 'TUTORIALSpoint' 等。

let exp = /\d+/;
// \d – 它匹配 0 到 9 之间的数字。
// + – 它匹配一个或多个数字。

let exp = /^Hi/;
// ^ - 匹配文本的开头。
// Hi – 它检查文本是否以 'Hi' 开头。

let exp = /^[a-zA-Z0-9]+@[a-zA-Z]+\.[a-zA-Z]{2,3}$/;
// ^ - 邮件地址的开头。
// [a-zA-Z0-9] – 应该包含开头的字母数字字符。
// + - 应该包含至少一个字母数字字符。
// @ - 应该在字母数字字符之后有 '@' 字符。
// [a-zA-Z]+ - 在 '@' 字符之后，应该包含至少一个字母数字字符。
// \. – 应该在此之后有一个点。
// [a-zA-Z] – 在点之后，邮件地址应该包含字母字符。
// {2, 3} – 在点之后，应该只包含 2 或 3 个字母字符。这指定了长度。
// $ - 它代表模式的结尾。

现在的问题是，如果我们可以通过将字符串作为参数传递给 search() 或 replace() 方法来搜索或替换字符串中的文本，那么为什么还需要正则表达式呢？

这个问题很自然。让我们通过下面的例子来理解它。

示例

在下面的示例中，我们使用正则表达式字面量来定义正则表达式。该模式匹配 'tutorialspoint' 字符串而不比较字符的大小写。

在第一种情况下，字符串 search() 方法搜索 'tutorialspoint' 字符串，这是大小写敏感的匹配。因此，它返回 -1。

在第二种情况下，我们将正则表达式作为 search() 方法的参数。它执行不区分大小写的匹配。因此，它返回 11，即所需模式的索引。

示例代码：

<html>
<head>
   <title> JavaScript - 正则表达式 </title>
</head>
<body>
   <p id="output"> </p>
   <script>
      const output = document.getElementById("output");
      let pattern = /tutorialspoint/i;
      let str = "欢迎来到 TuTorialsPoint！这是一个很好的网站！";
      let res = str.search('tutorialspoint');
      output.innerHTML += "使用字符串搜索 : " + res + "<br>";
      res = str.search(pattern);
      output.innerHTML += "使用正则表达式搜索 : " + res;
   </script>
</body>
</html>

执行程序以查看预期的结果。

示例

在下面的示例中，我们使用 replace() 方法来匹配模式并将它替换为 '100' 字符串。

这里，模式匹配数字对。输出显示字符串中的每个数字都被 '100' 替换。您也可以在字符串中添加字母字符。

示例代码：

<html>
<head>
   <title> JavaScript - 正则表达式 </title>
</head>
<body>
   <p id="output"> </p>
   <script>
      let pattern = /\d+/g; // 匹配数字对
      let str = "10, 20, 30, 40, 50";

      let res = str.replace(pattern, "100");
      document.getElementById("output").innerHTML = 
         "替换后的字符串 : " + res;
   </script>
</body>
</html>

执行程序以查看预期的结果。

示例（电子邮件验证）

在下面的示例中，我们使用带有 'new' 关键字的 RegExp() 构造函数创建正则表达式。同时，我们将模式作为构造函数的字符串参数传递。

在这里，我们使用正则表达式验证电子邮件。在第一种情况下，电子邮件有效。在第二种情况下，电子邮件不包含 '@' 字符，所以 test() 方法返回 false。

示例代码：

<html>
<body>
   <p id="output"> </p>
   <script>
      const pattern = new RegExp('^[a-zA-Z0-9]+@[a-zA-Z]+\.[a-zA-Z]{2,3}$');
      document.getElementById("output").innerHTML = 
         "abcd@gmail.com 是有效的吗？: " + pattern.test('abcd@gmail.com') + "<br>" +
         "abcdgmail.com 是有效的吗？: " + pattern.test('abcdgmail.com');
   </script>
</body>
</html>

因此，正则表达式可以用于在文本中查找特定模式并执行替换等操作。

RegExp 属性

以下是一些与 RegExp 相关的属性及其描述。

Sr.No.	属性 & 描述
1	constructor
	指定创建对象原型的函数。
2	global
	指定是否设置了 "g" 修饰符。
3	ignoreCase
	指定是否设置了 "i" 修饰符。
4	lastIndex
	开始下一个匹配的索引。
5	multiline
	指定是否设置了 "m" 修饰符。
6	source
	模式的文本。

在以下部分，我们将有一些示例来演示 RegExp 属性的使用。

RegExp 方法

以下是一些与 RegExp 相关的方法及其描述。

Sr.No.	方法 & 描述
1	exec()
	在其字符串参数中执行匹配搜索。
2	test()
	在其字符串参数中测试匹配。
3	toSource()
	返回表示指定对象的对象文字；您可以使用此值创建一个新的对象。
4	toString()
	返回表示指定对象的字符串。

在以下部分，我们将有一些示例来演示 RegExp 方法的使用。