Javascript 正規表達式

建立正規式

正規式也可以叫做正則表達式，在 JavaScript 中可以使用兩個 / 或 new RegExp 來建立，且其型別為物件

const ares = /a+87/
const ares = new RegExp('a+87')

typeof /a+87/
// object

如需要測試也可使用regex101

使用時機

正規式常常會用在搜尋與取代兩個地方，讓我們看看如何使用

搜尋

使用 test 方法可以檢視是否有符合字串，會回傳 true 或是 false

const ares = "Hello everybody, I am a loner."

/friend/.test(ares)
// false

取代

JavaScript 中取代會使用 replace 方法，這時候就可以使用正規式

const ares = "Hello everybody, I am a loner."

ares.replace(/loner/, "loser")
// "Hello everybody, I am a loser."

開始使用

除了單純使用字元來過濾以外，正規式還有許多功能語法，這裡列出大部分的語法~

符號類

• \
  正規式有需多預設的功能符號，如需單純輸出符號則需加上反斜線
  例如: \^ 表示匹配 ^ 符號
• |
  表示多個條件，例如: /aa|cc/ 匹配 aabbcc 中的 aa 或 cc
• ^
  1.表示開頭需匹配的字串，例如: /^abc/ 表示字串開頭須為 abc
  2.如寫在 [] 內則為排除字串，例如: /[^abc]/ 表示排除所有 abc 開頭字串
• $
  與 ^ 相反，表示字尾須匹配的字串，須加在字元後方
  例如: /abc$/ 表示匹配所有 abc 結尾的字串
• *
  表示匹配前一字 0 到多次，例如: /bo*/ 匹配 booed 中的 boo
• +
  表示匹配前一字 1 到多次，例如: /bo+/ 不會匹配 brooded 中的任何字元
• ?
  表示匹配前一字 0 到 1 次，例如: /bo?/ 匹配 booed 中的 bo
• .
  匹配換行符號以外所有字元

功能類

• []
  限制搜尋的範圍，另外可使用 - 來指定一個範圍
  例如: /[a-z]/ 表示匹配 a 到 z 的所有字元
• {n, m}
  規定符號確切發生的次數為 n ~ m 次，n、m 為正整數，m 若不填則無上限
  例如: /a{0, 2}/ 表示匹配 a 出現 0~2 次的字串

群組類

• ()
  將小括號內的東西當成一個群組，可重複使用，依照順序為 1~n
  例如: /(foo)(bar)\1\2/ 可匹配 foobarfoobar，\1 = foo、\2 = bar
  使用 replace 取代字串則需使用 $ 符號

const abc3 = "foobarfoobar"
abc3.replace(/(foo)(bar)\1\2/, '$1')
// "foo"

• (?:y)
  同 ()，但是不會記憶群組
• x(?=y)
  尋找符合 x 的字元，且字元後面須接 y ，不會記憶群組
• x(?!y)
  尋找符合 x 的字元，且字元後面不是 y ，不會記憶群組

反斜線英文類

這類有些有大小寫，大小寫匹配的字元都是互補的

• \w
  等同於 [A-Za-z0-9_]
• \W
  等同於 [A-Za-z0-9_] 以外的字元

---

• \s
  匹配任何空白，包括空格、製表符、換頁符、換行符，例如: /\s\w*/ 匹配 foo bar 中的 bar
• \S
  匹配任何不是空白的字元，例如: /\S\w*/ 匹配 foo bar 中的 foo

---

• \d
  匹配任何數字，等同於 [0-9]
• \D
  匹配任何非數字，等同於 [^0-9]

---

• \b
  所有匹配且在邊界的字元，例如: /\bm/ 匹配 moon 中的 m
• \B
  所有匹配且不在邊界的字元，例如: /\B../ 匹配 noonday 中的 oo

---

• \r
  匹配 Enter 符號
• \n
  匹配換行符號
• \t
  匹配 tab 符號
• \xhh、\uhhhh
  使用 Unicode 編碼或是 ASCII 編碼，例如: /[\x21]/、/[\u4E00-\u9FA5]/

參數

參數會寫在 / 後方

// 單個參數
const ares = /a+87/g
const ares = new RegExp('a+87', 'g')

// 多個參數
const ares = /a+87/gi
const ares = new RegExp('a+87', 'gi')

參數的種類，目前 JavaScript 不只這三種，但是這三個最常用的~

• g:global，範圍為全域，不加此參數只會找到第一個
• i:insensitive，不區分大小寫
• m:muliti line，可匹配多行，主要應用於 ^ 與 $ 符號

// 加上 \n 會換行
const abc1 = "abc123\nabc123\nabc123"
const abc2 = "abc123abc123abc123"

// g
abc2.replace(/a/, "b")
// "bbc123abc123abc123"
abc2.replace(/a/g, "b")
// "bbc123bbc123bbc123"

// i
abc2.replace(/A/gi, "b")
// "bbc123bbc123bbc123"

// m
abc1.replace(/^A/gim, "b")
// "bbc123\nbbc123\nbbc123"