天天看點
傳回

您唯一需要的 RegEx 指南

您唯一需要的 RegEx 指南

正規表達式是字元 模式 将文本中的字元序列關聯起來。我們可以使用正規表達式來提取或替換部分文本，以及 HTML 頁面中的位址或連結圖像、修改文本格式或删除無效字元。

在本文中，我們将學習以下主題及更多内容：

  • 正規表達式的結構如何？
  • 正規表達式的元素是什麼？
  • 如何在 Javascript 中使用正規表達式？
  • 獎金： 最有用的正規表達式備忘單

我們開工吧！

您唯一需要的 RegEx 指南

Photo by 布萊克康納利 on 不飛濺

RegEx 的結構如何？

正規表達式基本上由 3 個元件組成：

  1. RegEx 本身，負責定義要比對的模式
  2. 資料輸入，構成将要經過正規表達式作用的資料
  3. 引擎，負責應用表達式

例如：假設我們需要一個 RegEx 驗證電子郵件。 在這種情況下，我們将有以下元件：

  1. RegEx 将描述 有效電子郵件的模式
  2. 資料輸入将是 電子郵件通知 由使用者進行驗證
  3. 引擎将是 程式設計語言 用于應用表達式

如何建立正規表達式？

正規表達式必須用斜線 (/) 括起來。并且在表達式之後，可能會有一些被調用的執行訓示 旗幟 .

/元字元/[标志]

标志用于為引擎提供執行正規表達式時使用的特殊參數。标志是可選的，将被執行正規表達式的引擎接受或拒絕。

最常見的标志是：

  • 我（忽略大小寫） — 不應考慮大小寫字元之間的差異。
  • g（全球來源） — 在資料輸入時啟用全局資料捕獲，以及儲存出現索引并允許在它們之間導航（即，如果您的輸入多次比對，使用此标志您将獲得所有結果，否則隻會傳回第一個比對項）
  • m（多行） — 通知條目由多行組成，進而将正規表達式應用于每一行。

什麼是元字元？

元字元是在正規表達式中有意義的特殊字元。它們用于告訴引擎如何解析輸入資料。正規表達式或 RegEx 由一組這些元字元組成。

每個元字元 服務于特定的功能 視情況而定。您可以建立許多組合并使用這些組合來執行更複雜的表達式。

讓我們看看最常用的元字元：

開始 (^) 和結束 ($)

^（開始） — 表示正規表達式中的行首。句法：

/^<....>/

 $（結束） — 表示正規表達式中的行尾。句法：

/<...>$/

示例 1：

  • 正規表達式：

    /^[1,9]/g
  • 輸入：

    0,1,2,3,4

這裡 沒有比對 ，因為 RegEx 搜尋的行 開始 字元介于 1 和 9 之間。

示例 2：

  • 正規表達式：

    /^[1,9]/g
  • 輸入：

    1,2,3,4,5
  • 火柴：

    1

這裡 有一場比賽 ，因為輸入以數字 1 開頭。

示例 3：

  • 正規表達式：

    /[1,9]$/g
  • 輸入：

    1,2,3,4,5
  • 火柴：

    5

也是一場比賽 , 但使用行尾，是以它比對數字 5。

字元組（[ 和 ]）

[（小組開始） — 表示字元組的開始。句法：

/[<....>]/

 ]（小組結束） — 表示字元組的結束。句法：

/[<...>$]/

例子：

想象一下，我們想要擷取名稱為“John”的所有比對項，無論它們是用大寫字母還是小寫字母書寫的。然後我們需要告訴引擎第一個字元可以是“j”或“J”。

  • 正規表達式：

    /[J,j]ohn/g

  • 輸入：

    約翰

    約翰

    約翰

    約瑟夫

  • 火柴：

    約翰

     ,

    約翰

點 (.)

. （通配符） — 表示任何其他字元。句法：

/./

例子：

想象一下，我們想要擷取所有有四個字母并以字尾“and”結尾的單詞。

  • 正規表達式：

    /.和/g

  • 輸入：

    沙

    相同的

    棍棒

    土地

    牌

  • 火柴：

    沙

     ,

    棍棒

     ,

    土地

邏輯運算符 AND (.*)

。 （和）* — 在兩個表達式之間進行邏輯運算 AND。句法：

/<exp-1> .*<exp-2> /

例子：

想象一下，我們想要擷取所有以元音開頭和結尾的名字。

  • 正規表達式：

    /[AEIOU].*[aeiou]/g

  • 輸入：

    阿米拉

    安娜

    勞拉

    蘇菲

    奧利維亞

  • 火柴：

    阿米拉

     ,

    安娜

     ,

    奧利維亞

邏輯運算符 OR (|)

| （或者） — 在兩個表達式之間進行邏輯運算 OR。句法：

_/ <exp-1> |<exp-2> /_

例子：

想象一下，我們想從資料輸入中擷取所有大型商店（超級商店或大型商店）。

  • 正規表達式：

    /^(super|mega)store/gm

  • 輸入：

    超市

    小店

    大型商店

  • 火柴：

    超市

     ,

    大型商店

邏輯運算符 NOT (^)

^ （不是） — 在表達式之前進行邏輯運算 NOT。句法：

_/[_ ^<exp> ] _/_

例子：

想象一下，我們想要擷取所有不以元音開頭的名稱。

  • 正規表達式：

    /^[^AEIOU].*/gm

  • 輸入：

    阿曼達

    山姆

    約翰

    安娜

  • 火柴：

    山姆

     ,

    約翰

花括号（{ 和 }）

{} （重複） — 允許您檢測表達式在 n 次或範圍内的重複。句法：

_/ <exp> {最小，最大}/_

例子：

讓我們編寫一個表達式來擷取所有包含 7 個字母并以結尾的單詞 nd .

  • 正規表達式：

    /^.{7}nd*/gm

  • 輸入：

    指令

    反彈

    芥末

    管理人員

    入站

  • 火柴：

    指令

     ,

    反彈

     ,

    入站

加号 (+)

+（出現 1 次或多次） — 檢查左邊的字元是否在輸入中至少出現一次。句法：

_/ <exp> +/_

例子：

讓我們編寫一個表達式來擷取所有出現的字元“c”。

  • 正規表達式：

    /a+/gm

  • 輸入：

    音樂

    書

    技術

    成功

  • 火柴：

    穆斯 **C**

     ,

    這 **C** 技術學

     ,

    他們是 **抄送** 埃斯

問号 (?)

? （0 或 1 次出現） — 檢查左邊的字元是否在輸入中出現 0 或至少出現一次。使其成為可選。句法：

_/ <exp> ?/_

例子：

想象一下，我們想要獲得單數或複數形式的 car，但不要拼錯。

  • 正規表達式：

    /^car[s]?$/gm

  • 輸入：

    車

    汽車

    卡茲

  • 火柴：

    車

     ,

    汽車

星号 (*)

*（0 次或多次出現） — 檢查左邊的字元是否在輸入中出現 0 次或多次。句法：

_/ <exp> */_

例子：

想象一下，我們想要得到與這個人寫的一樣多的“y”這個詞。

  • 正規表達式：

    /^嘿*$/gm

  • 輸入：

    嘿

    嘿嘿

    嘿嘿

    嘿嘿

  • 火柴：

    嘿

     ,

    嘿嘿

     ,

    嘿嘿

連字元 (-)

- （間隔） — 檢查與字元間隔對應的比對項。句法：

_/[ <start> -<end> ]/_

例子：

想象一下，我們想要擷取從字母 A 到 M 的所有名稱。

  • 正規表達式：

    /^[上午].*$/gm

  • 輸入：

    阿曼達

    内特

    喬

    克拉克

  • 火柴：

    阿曼達

     ,

    喬

     ,

    克拉克

字母數字和非字母數字（\w 和 \W）

\w（字母數字） — 檢查字母數字字元和下劃線。句法：

_/\w/_

 \W（非字母數字） — 檢查非字母數字字元（例如特殊字元）。句法：

_/\W/_

例子：

  • 正規表達式：

    /\w/gm

  • 輸入：

    測試

    1234

    測試_123

    測試$%測試

    $%&*&

  • 火柴：

    測試

     ,

    1234

     ,

    測試_123

     ,

    **測試** $% **測試**

數字和非數字（\d 和 \D）

\d（數字） — 檢查代表數字的字元。句法：

_/\d/_

 \D（非數字） — 檢查非數字字元。句法：

_/\D/_

例子：

  • 正規表達式：

    /\d/gm

  • 輸入：

    123

    測試

    測試_123

  • 火柴：

    123

     ,

    測試_ **123**

空格和非空格（\s 和 \S）

\s（空格） — 檢查對應于空格的字元（空格、制表符、換行符和回車符）。句法：

_/\s/_

 \S（非數字） — 檢查非空格字元。句法：

_/\S/_

捕獲和非捕獲組（“()”和“(?😃”）

()（捕獲組） — 對要捕獲的字元序列進行分組。使用此元字元時會産生子比對。句法：

_/( <characters> )/_

 (?😃（非捕獲組） — 對不應捕獲的字元序列進行分組。句法：

_/（？： <characters> )/_

如何在 Javascript 中使用正規表達式？

在 Javascript 中，正規表達式是 RegExp 類的對象。我們可以用兩種方式定義它：

字面形式： 

常量 myExpression = /test/;

使用 RegExp 構造函數：

const myExpression = new RegExp('test');

然後，我們可以開始使用我們的表達式，假設我們想在一個字元串中找到一個比對項：

常量 newRE = /d(b+)d/g;  
 常量比對 = newRE.exec('cdbbdbsbz');

正規表達式方法

建立正規表達式後，我們可以使用一些方法，以下是其中的一些：

  • 執行（） — **** 在字元串中搜尋比對并傳回結果數組

    const myExp = RegExp('foo*', 'g');

    myExp.exec('桌上足球，桌上足球');

  • 測試（） — 在字元串中搜尋比對并傳回

    真的

     或者

    錯誤的

    const str = '桌上足球';

    const regex = new RegExp('foo*'); 正規表達式.test(str); // 真的

  • 比對（） — 在字元串中搜尋比對項并傳回結果數組

    const 段落 = '這隻靈活的棕色狐狸被命名為瑪麗。';

    常量正規表達式 = /[AZ]/g;

    const found = paragraph.match(regex); 控制台.log（找到）； // 數組 ["T", "M"]

  • 搜尋（） — 搜尋正規表達式之間的比對并傳回比對的索引

    const 段落 = '這隻靈活的棕色狐狸跳過了懶惰的狗。如果狗吠，它真的很懶嗎？ // 任何不是單詞字元或空格的字元

    常量正規表達式 = /[^\w\s]/g; console.log(paragraph.search(regex)); // 43

  • 代替（） — 傳回一個新字元串，其中一個、部分或所有比對的模式被替換

    const text = '靈活的棕色狐狸跳過懶狗。如果狗有反應，它真的很懶嗎？ 常量正規表達式 = /Dog/i;

    console.log(text.replace(regex, 'ferret'));

    // “靈活的棕狐跳過了懶惰的雪貂。如果狗有反應，那真的是懶惰嗎？”

最常用的正規表達式備忘單

  • 電子郵件

    [a-zA-Z0-9.!#$%&'*+/=?_`{|}~-][email protected][a-zA-Z0-9](?:[a-zA- Z0-9-]{0,61}[a-zA-Z0-9])?(?:.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0 ,61}[a-zA-Z0-9])?)*$

  • 電子郵件（但僅限 Gmail 和 Hotmail）

    ^([\w-.][email protected](?!gmail.com)(?!hotmail.com)([\w- ]+.)+[\w-]{2,4})? $

  • 網址

    ^(?:http(s)?😕/)?[\w.-]+(?:.[\w.-]+)+[\w-._~:/? #[]@!$&'()*+,;=.]+$

  • 電話和手機号碼

    ((?([\d -)\–+/(]+))?([ .-–/]?)([\d]+))

  • 修剪字元串

    [1](.?)[\s]*$

  • IP位址

    ^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?).(25[0-5]|2[0 -4][0-9]|[01]?[0-9][0-9]?).(25[0-5]|2[0-4][0-9]|[01] ?[0-9][0-9]?).(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]? )$

  • 使用者名（1-15 個字母數字字元）

    ^(?=.[a-zA-Z]{1,})(?=.[\d]{0,})[a-zA-Z0-9]{1,15}$

結論

這就是今天的内容。這是一篇很長的文章，但我真的希望這篇文章對您使用 RegEx 有所幫助，并且您将來可以在編寫新表達式時将其用作指南。

謝謝閱讀！在本平台關注我，閱讀更多開發内容。祝你有美好的一天，很快再見！

版權聲明：本文為部落客原創文章，遵循 CC 4.0 BY-SA 版權協定，轉載請附上原文出處連結和本聲明

本文連結：https://www.qanswer.top/20718/39060700

  1. \s ↩︎
javascript;java;程式設計
上一篇: 使用 useMemo、useCallback 和 React.memo 優化 React Render
下一篇: CI架構3.X淺析

繼續閱讀