正则表达式和 RegExp 对象
JavaScript 中的正则表达式(RegExp)是一个描述字符模式的对象。它可以包含字母、数字和特殊字符。此外，正则表达式模式可以包含单个或多个字符。
JavaScript RegExp 类表示正则表达式，String 和 RegExp 都定义了使用正则表达式对文本执行强大的模式匹配和搜索替换功能的方法。
正则表达式用于在字符串中搜索特定模式或用新字符串替换该模式。
在 JavaScript 中，有两种构造正则表达式的方法。
使用 RegExp() 构造函数。
使用正则表达式字面量。
语法
可以使用 RegExp () 构造函数定义正则表达式，如下所示 -
var pattern = new RegExp(pattern, attribute); 或者简单地 var pattern = /pattern/attributes;
参数
参数说明如下 -
pattern - 指定正则表达式模式或其他正则表达式的字符串。
attributes - 可选字符串，包含"g"、"i"和"m"属性，分别指定全局匹配、不区分大小写匹配和多行匹配。
在学习正则表达式示例之前，我们先来了解一下正则表达式修饰符、量词、字面字符等。
修饰符
有几种修饰符可以简化您使用正则表达式的方式，例如区分大小写、多行搜索等。
| 序号 | 修饰符和说明 |
|---|---|
| 1 |
i 执行不区分大小写的匹配。 |
| 2 |
m 指定如果字符串包含换行符或回车符，则 ^ 和 $ 运算符现在将与换行符边界匹配，而不是与字符串边界匹配。 |
| 3 |
g 执行全局匹配，即查找所有匹配项，而不是在第一个匹配项后停止。 |
方括号
方括号 ([]) 在正则表达式中使用时具有特殊含义。它们用于查找字符范围。
| 序号 | 表达式和描述 |
|---|---|
| 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 的任何小写字符。
量词
括号字符序列和单个字符的频率或位置可以用特殊字符表示。每个特殊字符都有特定的含义。+、*、? 和 $ 标志都跟在一个字符序列后面。
| 序号 | 表达式和说明 |
|---|---|
| 1 |
p+ 它匹配任何包含一个或多个 p 的字符串。 |
| 2 |
p* 它匹配任何包含零个或多个 p 的字符串。 |
| 3 |
p? 它匹配任何最多包含一个 p 的字符串。 |
| 4 |
p{Nn{n} 它匹配任何包含 N 个 p 序列的字符串。 |
| 5 |
p{2,3} 它匹配任何包含两个或三个 p 的字符串。 |
| 6 |
p{2,} 它匹配任何包含至少两个 p 的字符串。 |
| 7 |
p$ 它匹配任何以 p 结尾的字符串。 |
| 8 |
^p 它匹配任何以 p 开头的字符串它。 |
| 9 |
?!p 它匹配任何后面不跟字符串 p 的字符串。 |
示例
以下示例详细介绍了如何匹配字符。
| 序号 | 表达式和说明 |
|---|---|
| 1 |
[^a-zA-Z] 它匹配任何不包含 a 到 z 和 A 到 Z 范围内任何字符的字符串。 |
| 2 |
p.p 它匹配任何包含 p 后跟任意字符，再后跟另一个 p 的字符串。 |
| 3 |
^.{2}$ 它匹配任何包含恰好两个字符的字符串。 |
| 4 |
<b>(.*)</b> 它匹配任何包含在 <b> 和 </b> 中的字符串。 |
| 5 |
p(hp)* 它匹配任何包含 p 后跟零个或多个 hp 序列实例的字符串。 |
文字字符
在正则表达式中，文字字符可以与反斜杠 (\) 一起使用。它们用于在正则表达式中插入特殊字符，例如制表符、空字符、Unicode 等。
| 序列号 | 字符和说明 |
|---|---|
| 1 |
字母数字 本身 |
| 2 |
\0 NUL 字符 (\u0000) |
| 3 |
制表符 (\u0009 |
| 4 |
换行符 (\u000A) |
| 5 |
\v 垂直制表符 (\u000B) |
| 6 |
\f 换页符 (\u000C) |
| 7 |
回车符 (\u000D) |
| 8 |
\xnn 十六进制数 nn 指定的拉丁字符;例如，\x0A 是与 相同 |
| 9 |
\uxxxx 十六进制数 xxxx 指定的 Unicode 字符;例如，\u0009 与 相同 |
| 10 |
\cX 控制字符 ^X;例如，\cJ 相当于换行符 |
元字符
元字符只是一个字母字符，前面加一个反斜杠，用于赋予组合特殊含义。
例如，您可以搜索一大笔钱使用 '\d' 元字符:/([\d]+)000/，此处 \d 将搜索任意数字字符串。
下表列出了可在 PERL 风格正则表达式中使用的一组元字符。
| 序列号 | 字符及说明 |
|---|---|
| 1 |
. 单个字符 |
| 2 |
\s 空白字符(空格、制表符、换行符) |
| 3 |
\S 非空白字符 |
| 4 |
\d 数字 (0-9) |
| 5 |
\D a非数字 |
| 6 |
\w 单词字符 (a-z, A-Z, 0-9, _) |
| 7 |
\W 非单词字符 |
| 8 |
[\b] 文字退格键(特殊情况)。 |
| 9 |
[aeiou] 匹配给定集合中的单个字符 |
| 10 |
[^aeiou] 匹配给定集合之外的单个字符 |
| 11 |
(foo|bar|baz) 匹配任何指定的选项 |
下面让我们学习创建正则表达式。
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]+ - '@' 字符后必须至少包含 1 个字母数字字符。
\.其后必须包含一个点。
[a-zA-Z] 点后，电子邮件应包含字母字符。
{2, 3} 点后，电子邮件应仅包含 2 或 3 个字母字符。它指定长度。
$ - 表示模式的结尾。
现在的问题是，我们是否可以使用 search() 或 replace() 方法通过将字符串作为参数传递来搜索或替换字符串中的文本;那么为什么需要正则表达式呢?
问题很明显。让我们通过下面的示例来理解。
示例
在下面的示例中，我们使用正则表达式字面量来定义正则表达式。该模式匹配"tutorialspoint"字符串，但不比较字符的大小写。
在第一种情况下，字符串 search() 方法搜索"tutorialspoint"字符串，并执行区分大小写的匹配。因此，它返回 -1。
在第二种情况下，我们将正则表达式作为 search() 方法的参数传递。它执行不区分大小写的匹配。因此，它返回 11，即所需模式的索引。
<html>
<head>
<title> JavaScript - Regular Expression </title>
</head>
<body>
<p id = "output"> </p>
<script>
const output = document.getElementById("output");
let pattern = /tutorialspoint/i;
let str = "Welcome to TuTorialsPoint! It is a good website!";
let res = str.search('tutorialspoint');
output.innerHTML += "Searching using the string : " + res + "<br>";
res = str.search(pattern);
output.innerHTML += "Searching using the regular expression : " + res;
</script>
</body>
</html>
执行程序以查看所需结果。
示例
在下面的示例中，我们使用 replace() 方法匹配模式并将其替换为字符串"100"。
此处，模式匹配数字对。输出显示字符串中的每个数字都被替换为"100"。您还可以在字符串中添加字母字符。
<html>
<head>
<title> JavaScript - Regular expression </title>
</head>
<body>
<p id = "output"> </p>
<script>
let pattern = /\d+/g; // Matches pair of digits
let str = "10, 20, 30, 40, 50";
let res = str.replace(pattern, "100");
document.getElementById("output").innerHTML =
"String after replacement : " + res;
</script>
</body>
</html>
执行程序以查看所需结果。
示例(电子邮件验证)
在下面的示例中，我们使用 RegExp() 构造函数和"new"关键字来创建正则表达式。此外，我们还将字符串格式的模式作为构造函数的参数传递。
在这里，我们使用正则表达式验证电子邮件。在第一种情况下，电子邮件有效。在第二种情况下，电子邮件不包含 @ 字符，因此 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 is valid? : " + pattern.test('abcd@gmail.com') + "<br>" +
"abcdgmail.com is valid? : " + pattern.test('abcdgmail.com');
</script>
</body>
</html>
因此，正则表达式可用于在文本中查找特定模式并执行替换等操作。
RegExp 属性
以下是与 RegExp 相关的属性列表及其说明。
| 序号 | 属性 &说明 |
|---|---|
| 1 |
constructor
指定创建对象原型的函数。 |
| 2 |
global
指定是否设置了"g"修饰符。 |
| 3 |
ignoreCase
指定是否设置了"i"修饰符。 |
| 4 |
lastIndex
下一个匹配的起始索引。 |
| 5 |
multiline
指定是否设置了"m"修饰符。 |
| 6 |
source
模式的文本。 |
在接下来的部分中，我们将通过一些示例来演示 RegExp 属性的用法。
RegExp方法
以下是与 RegExp 相关的方法及其说明的列表。
| 序号 | 方法及说明 |
|---|---|
| 1 |
exec()
在其字符串参数中执行匹配搜索。 |
| 2 |
test()
在其字符串参数中测试匹配。 |
| 3 |
toSource()
返回表示指定对象的对象字面量;您可以使用此值创建一个新对象。 |
| 4 |
toString()
返回表示指定对象的字符串。 |
在接下来的部分中，我们将通过一些示例来演示 RegExp 方法的用法。
