解释ES6中的正则表达法

ES6是2015年推出的最新JavaScript版本。我们将了解Es6包含的RegExp即正则表达式的所有功能。

什么是正则表达式及其使用方法

正则表达式是一个字符串，代表包含不同字符的特定搜索模式，如数字、字母和特殊字符。

让我们了解一下正则表达式的实时用法。

我们希望大家在过去填写任何表格时，都会看到特定的表格字段验证错误。例如，如果你没有输入带有’@’字符的电子邮件，或者输入10位数的手机号码，它就会给出一个错误。因此，我们可以使用正则表达式进行表单字段输入验证。

此外，我们还可以使用正则表达式在字符串中找到一个特定的子串，并用新的字符串替换它。

正则表达式可用于密码验证，以确保密码是否强大。

像上面这样的正则表达式可以有很多用途。

语法

我们可以使用下面给出的两种不同的方式来定义正则表达式。

字面符号 – 用户需要在两个正斜杠之间定义搜索模式，将搜索模式表示为正则表达式。

myImage.style.display = "block";

构造函数 – 我们可以使用带有新关键字的 RegExp() 构造函数来定义正则表达式对象。用户可以按照下面的语法来使用构造函数定义正则表达式。

var pattern = new RegExp(search_pattern, attributes);

属性

我们可以使用下面给出的多种属性的组合。

属性	描述
G	它用于字符串中的全局匹配。
I	它忽略了字符串中的大小写。
M	它用于多行之间的匹配。
U	U代表Unicode，它允许将正则表达式作为Unicode代码点的一个序列。
Y	它用于从最后一个索引开始匹配。

构建正则表达式

我们可以使用不同的特殊字符来建立一个正则表达式，下面我们将通过实例来了解。

Brackets

我们可以使用括号来定义正则表达式模式中的字符范围。

括号内的符号	描述
`[abc…]`	它在搜索字符串中搜索括号内的任何单个字符。
`[^abc…]`	它搜索任何不在括号内的单一字符。
`[D−L]`	它搜索D和L之间的任何单一大写字母。
`[d−l]`	它搜索D和L之间的任何一个小写字符。
`[0−9]`	它搜索的是0到9之间的任何一个数字。

示例 1

在这个例子中，我们使用修饰符’g’和括号符号创建了一个模式，并将该模式与信息字符串匹配。你可以观察到，它只从JavaScript中返回’Script’，因为我们没有使用’I’修饰符忽略这个情况。

<html>
<body>
   <h2> Using the bracket notations in the regular expression </h2>
   <p id="output"> </p>
</body>
   <script>
      let output = document.getElementById("output");
      let message ="TutorialsPoint is a great website to learn JavaScript and Typescript.";
      // defining the regular expression pattern
      var pattern = new RegExp("Script", "g");
      // matching the pattern in string
      var script_match1 = message.match(pattern);
      output.innerHTML +=
      "All matches without case ignorance: " + script_match1 + "<br/>";
   </script>
</html>

示例 2

在这个例子中，我们找到了所有无视大小写的匹配。你可以观察到，我们使用’I’修饰语忽略了这个案例。

<html>
<body>
   <h2> Using the bracket notations in the regular expression </h2>
   <p id="output"> </p>
   </body>
   <script>
      let output = document.getElementById("output");
      let message ="TutorialsPoint is a great website to learn JavaScript and Typescript.";
      // Matching with case ignorance
      pattern = new RegExp("Script", "gi");
      script_match1 = message.match(pattern);
      output.innerHTML +=
      "All matches with case ignorance:" + script_match1 + "<br/>";
   </script>
</html>

示例 3

在这个例子中，我们匹配’a’和’c’之间的字符。

<html>
<body>
   <h2> Using the bracket notations in the regular expression </h2>
   <p id="output"> </p>
   </body>
   <script>
      let output = document.getElementById("output");
      let message ="TutorialsPoint is a great website to learn JavaScript and Typescript.";
      // matching from a particular range
      pattern = new RegExp("[a-c]", "g");
      script_match1 = message.match(pattern);
      output.innerHTML +=
      "All matches between a to c: " + script_match1 + "<br/>";
   </script>
</html>

量词

我们可以使用量词来匹配给定字符串中的特定数量的字符。我们可以使用不同的特殊字符来创建不同类型的量化指标。

Quantifier	描述
C+	它搜索一个包含一个或多个C的字符串。
C*	它搜索一个包含零个或多个C的字符串。
C{M}	它搜索的是一个正好包含M个C的字符串。
C{M, N}	它搜索一个包含M和N之间的C的总数的字符串。
C{M, }	它搜索一个至少包含M个C.}的字符串。
C$	它搜索一个以C结尾的字符串。
^C	它搜索一个以C开头的字符串。

示例

在这个例子中，我们在创建正则表达式时使用了不同的量词，用正则表达式模式匹配信息字符串。

<html>
<body>
   <h2> Using the <i> Quantifiers </i> in the regular expression </h2>
   <p id="output"> </p>
</body>
   <script>
      let output = document.getElementById("output");
      let message =
      "TutorialsPoint is a great website to learn JavaScript and Typescript.";
      // defining the regular expression pattern
      var pattern = new RegExp("a+", "g");

      // matching the pattern in string
      var script_match1 = message.match(pattern);
      output.innerHTML +=
      "All matches which contain at least one a: " +
      script_match1 +
      "<br/>";

      // Matching with case ignorance
      pattern = new RegExp("^t", "gi");
      script_match1 = message.match(pattern);
      output.innerHTML +=
      "All matches which starts with t: " + script_match1 + "<br/>";
   </script>
</html>

字面字符

字面字符我们可以使用字面字符来表示正则表达式中的转义字符。

Literal	Description
\0	它表示NULL字符。
\t	它表示的是标签
\r	它表示的是换行。
\v	它表示的是垂直标签。
\r	它用于通过十六进制数字 xxxx 来指定 Unicode 字符 u。

示例

在这个例子中，我们使用了’\t’字样来转义tab，并在信息字符串中用’p’替换所有’T’字符。

<html>
<body>
   <h2> Using the <i> Literal characters </i> in the regular expression </h2>
   <p id="output"></p>
   </body>
   <script>
      let output = document.getElementById("output");
      let message =
      "TutorialsPoint is a great website to learn JavaScript and Typescript.";
      // defining the regular expression pattern
      var pattern = new RegExp("\T", "g");

      // matching the pattern in string
      var script_match1 = message.replace(pattern, "\p");
      output.innerHTML +=
      "After replacing the T in the string with p is : <br>" +
      script_match1 +
      "<br/>";
   </script>
</html>

Meta 字符

Meta 字符	描述
\s	它指定了空白处。
\S	它指定了非空白的空间。
\w	它指定了单词的字符。
\W	它指定了非字的字符。
\d	它指定的是小数点后的数字。
\D	它指定了非十进制的数字。