正則表示式和RegExp物件

上一頁
下一頁

JavaScript中的正則表示式(RegExp)是一個描述字元模式的物件。它可以包含字母、數字和特殊字元。此外，正則表示式模式可以包含單個或多個字元。

JavaScript的RegExp類表示正則表示式，String和RegExp都定義了使用正則表示式對文字執行強大的模式匹配和搜尋替換功能的方法。

正則表示式用於在字串中搜索特定模式或將模式替換為新字串。

在JavaScript中有兩種方法可以構造正則表示式。

  • 使用RegExp()建構函式。

  • 使用正則表示式字面量。

語法

正則表示式可以用RegExp()建構函式定義，如下所示：

var pattern = new RegExp(pattern, attributes);
or simply
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{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

空字元 (\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 風格正則表示式中使用的一組元字元。

序號 字元 & 說明
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|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>

執行程式以檢視所需的結果。

示例（電子郵件驗證）

在下面的示例中，我們使用帶有“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 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 方法的使用。

列印頁面
上一頁
下一頁
廣告