JavaScript中登入名的正規表示式及解析(0基礎)

簡言

在JavaScript中，經常會用到正規表示式來進行模式匹配。例如，登入名驗證，密碼強度驗證，字串查詢或替換等操作。現在就開始吧，零基礎寫出你的第一個正規表示式！

在做使用者註冊時，都會用到登入名正則校驗。要寫出正確的正規表示式，先要定義表示式規則。假設登入名做如下規則定義：

• 最短4位，最長16位 {4,16}
• 可以包含小寫大母 [a-z] 和大寫字母 [A-Z]
• 可以包含數字 [0-9]
• 可以包含下劃線 [ _ ] 和減號 [ – ]

根據以上規則，很容易給出正規表示式的字面量如下：

var pattern = /^[a-zA-Z0-9_-]{4,16}$/

測試

測試結果如下：

var pattern = /^[a-zA-Z0-9_-]{4,16}$/;
pattern.test(`ifat3`) = true
pattern.test(`42du`) = true
pattern.test(`42du-_`) = true
pattern.test(`_42du`) = true
pattern.test(`42d`) = false
pattern.test(`42du42du42du42du1`) = false
pattern.test(`42du@`) = false

測試程式碼

解析

字面量 / /

正規表示式的字面量定義為包含在一對斜槓（/）之間的字元，例如：

var pattern = /s$/;

上述字面量匹配所有以字母“s”結尾的字串。

字元類 [ ]

將字元放進方括號內就組成了字元類。一個字元類可以匹配它所包含的任意字元。因此，正規表示式/[abc]/就和字母“a”，“b”，“c”中的任意一個都匹配。

字元類可以使用連字元來表示字元範圍。要匹配拉丁小寫字母可以使用/[a-z]/。

[a-zA-Z0-9_-]表示匹配任意的拉丁大小寫字母，數字再加上下劃線和減號。

重複 ｛｝

在正規表示式中用{ }來表示元素重複出現的次數。

• {n,m} 匹配前一項至少n次，但不能超過m次
• {n,} 匹配前一項n次或更多次
• {n} 匹配前一項n次

[a-zA-Z0-9_-]{4,16} 表示匹配任意的拉丁大小寫字母，數字再加上下劃線和減號出現最少4次，最多16次。

匹配位置

• ^ 匹配字串的開頭，在多行檢索中，匹配一行的開頭
• $ 匹配字串的結尾，在多行檢索中，匹配一行的結尾

延伸1

根據以上說明，你一定理解了上述正規表示式所表達的含義，是不是很簡單！

假設你對上述規則不滿意，想增加一條規則，如下：

• 首字母只能是大小寫字母

很容易變更上述正規表示式如下：

var pattern = /^[a-zA-Z][a-zA-Z0-9_-]{3,15}$/;

給出測試結果如下：

var pattern = /^a-zA-Z{3,15}$/;
pattern.test(`ifat3`) = true
pattern.test(`Ifat3`) = true
pattern.test(`du42`) = true
pattern.test(`42du`) = false
pattern.test(`d42`) = false
pattern.test(`du42du42du42du421`) = false
pattern.test(`du42@`) = false

測試程式碼

延伸2

如果允許中文的登入名，變更規則，如下：

• 首字母只能是大小寫字母或中文基本漢字
• 其它位也可以包含中文基本漢字

給出如下正規表示式：

var pattern = /^[a-zA-Zu4E00-u9FA5][a-zA-Z0-9u4E00-u9FA5_-]{3,15}$/;

其中[u4E00-u9FA5]是漢字的正則匹配，包括基本漢字2萬多個，其中u4E00表示漢字“一”，具體請參見“漢字unicode編碼範圍”。

給出測試結果如下：

var pattern = /^a-zA-Zu4E00-u9FA5{3,15}$/;
pattern.test(`ifat3`) = true
pattern.test(`Ifat3`) = true
pattern.test(`毛三胖子`) = true
pattern.test(`42du`) = false
pattern.test(`d42`) = false
pattern.test(`du42du42du42du421`) = false
pattern.test(`du42@`) = false

測試程式碼

根據以上內容，定義你自己的登入名正規表示式吧！

原文連結