JavaScript學習總結(八)正規表示式

trigkit4發表於2016-09-16

這篇文章本來很早就要寫的,拖了挺久的,現在整理下,供大家學習交流哈!

基本概念

正規表示式是一種文字模式,包括普通字元(例如,a 到 z 之間的字母)和特殊字元(稱為“元字元”)。模式描述在搜尋文字時要匹配的一個或多個字串。

首先推薦幾個正規表示式編輯器

Debuggex :https://www.debuggex.com/
PyRegex:http://www.pyregex.com/
Regexper:http://www.regexper.com/

正規表示式是一種查詢以及字串替換操作。正規表示式在文字編輯器中廣泛使用,比如正規表示式被用於:

檢查文字中是否含有指定的特徵詞
找出文中匹配特徵詞的位置
從文字中提取資訊,比如:字串的子串
修改文字

說明:正規表示式通常用於兩種任務:1.驗證,2.搜尋/替換。用於驗證時,通常需要在前後分別加上^和$,以匹配整個待驗證字串;搜尋/替換時是否加上此限定則根據搜尋的要求而定,此外,也有可能要在前後加上\b而不是^和$。此表所列的常用正規表示式,除個別外均未在前後加上任何限定,請根據需要,自行處理。

優先權順序

在構造正規表示式之後,就可以象數學表示式一樣來求值,也就是說,可以從左至右並按照一個優先權順序來求值。 下表從最高優先順序到最低優先順序列出各種正規表示式操作符的優先權順序:

操作符 描述
\ 轉義符
(), (?:), (?=), [] 圓括號和方括號
*, +, ?, {n}, {n,}, {n,m} 限定符
^, $, \anymetacharacter 位置和順序

字元類匹配

字元 匹配
[...] 方括號內的任意字元
1 不在方括號內的任意字元
. 除了換行符和其他Unicode行終止符之外的任意字元
\w 任何ASCII字元組成的單詞,等價於[a-zA-Z0-9]
\W 任何不是ASCII字元組成的單詞,等價於2
\s 任何Unicode空白符
\S 任何非Unicode空白符的字元
\d 任何ASCII數字,介於[0-9]
\D 除了ASCII數字之外的任何字元,等價於3
\b 退格直接量

重複字元匹配

字元 匹配
{n,m} 匹配前一項至少n次,但不能超過m次
{n,} 匹配前一項n次或更多次
{n} 匹配前一項n次
匹配前一項0次或者1次,也就是說前一項是可選的,等價於{0,1}
+ 匹配前一項1次或多次,等價於{1,}
* 匹配前一項0次或多次,等價於{0,}

字元類:錨字元 匹配

元字元/元符號 匹配
$ 匹配字串的結尾,在多行檢索中,匹配一行的結尾
^ 匹配字串的開頭,在多行檢索中,匹配一行的開頭
\A 只有匹配字串開始處
\b 匹配單詞邊界,詞在 []內時無效
\B 匹配非單詞邊界
\G 匹配當前搜尋的開始位置
\Z 匹配字串結束處或行尾
\z 只匹配字串結束處

字元類:記錄字元 匹配

元字元/元符號 匹配情況
(string) 用於反向引用的分組
\1 或$1 匹配第一個分組中的內容
\2 或$2 匹配第二個分組中的內容
\3 或$3 匹配第三個分組中的內容

正規表示式修飾符

字元      含義
i        執行不區分大小寫的匹配
g        執行一個全域性匹配,即找到所有匹配而非一次匹配
m        多行匹配模式,^匹配一行的開頭和字串開頭,$匹配行的結束和字串的結尾

RegExp的方法

RegExp 物件有 3 個方法:test()、exec() 以及 compile()。

test():檢索字串中的指定值。返回值是布林值。
exec():返回一個陣列,陣列中的第一個條目是第一個匹配,其他的是反向引用

compile() 既可以改變檢索模式,也可以新增或刪除第二個引數。

String 物件中的正規表示式方法

方法 含義
match(pattern) 返回 pattern 中的子串或 null
replace(pattern, replacement) 用 replacement 替換 pattern
search(pattern) 返回字串中 pattern 開始位置
split(pattern) 返回字串按指定 pattern 拆分的陣列

建立正規表示式

構造正規表示式的方法和建立數學表示式的方法一樣。也就是用多種元字元與操作符將小的表示式結合在一起來建立更大的表示式。 可以通過在一對分隔符之間放入表示式模式的各種元件來構造一個正規表示式。

對 js 而言,分隔符為一對正斜槓 (/) 字元。例如:

/expression/

對 VBScript 而言,則採用一對引號 (“”) 來確定正規表示式的邊界。例如:

"expression"

看個例子

//匹配帳號是否合法(字母開頭,允許5-16位元組,允許字母數字下劃線
    var re =new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,19}$");
       `if(re.test(aaaa)){
            alert("格式正確");
        }else{
        alert("格式錯誤");
    }

正規表示式的元件可以是單個的字元、字符集合、字元範圍、字元間的選擇或者所有這些元件的任意組合。

match 方法

/*使用 match 方法獲取獲取匹配陣列*/ 
var pattern = /box/ig;//全域性搜尋 
var str = 'This is a Box!,That is a Box too'; 
alert(str.match(pattern)); //匹配到兩個 Box,Box
console.log(str.match(pattern).length);//獲取陣列的長度

search方法

/*使用 search 來查詢匹配資料*/
var pattern = /box/ig;
var str = 'This is a Box!,That is a Box too'; 
console.log(str.search(pattern));//查詢到返回位置,否則返回 -1

PS:因為 search 方法查詢到即返回,也就是說無需 g 全域性

replace方法

/*使用 replace 替換匹配到的資料*/
var pattern = /box/ig;
var str = 'This is a Box!,That is a Box too'; 
console.log(str.replace(pattern, 'Cat'));//將 Box 替換成了 Cat

split方法

/*使用 split 拆分成字串陣列*/

 var pattern = / /ig;
 var str = 'This is a Box!,That is a Box too';         
 console.log(str.split(pattern));//將空格拆開分組成陣列

exec方法

/* 統計子字串出現的所有位置*/

function count(str){
    var b,r=/def/g;
    while(b = r.exec(str)){
        console.log(b);
    }
}
count('abcdefabcdefabcdefabcdef');

輸出:

[ 'def', index: 3, input: 'abcdefabcdefabcdefabcdef' ]
[ 'def', index: 9, input: 'abcdefabcdefabcdefabcdef' ]
[ 'def', index: 15, input: 'abcdefabcdefabcdefabcdef' ]
[ 'def', index: 21, input: 'abcdefabcdefabcdefabcdef' ]

正規表示式選擇

一個正規表示式選擇包含1個或多個正規表示式序列。這些序列被豎線(|)字元分隔。如果這些序列中的任何一項符合匹配條件,那麼這個選擇就被匹配。他會按順序依次匹配

 "into".match(/in | int/);

以上將在into中匹配in。但他不會匹配int,因為in已經匹配成功了。

正規表示式轉義

\ / [ ] () { }  ? + * | . ^ $

如果希望按字面去匹配上面的字元,那麼必須用一個\字首來進行轉義。\字首不能使字母或數字字面化。

\f : 換頁符
\n : 換行符
\r : 回車符
\t : 製表(tab)符

\^    匹配 ^ 符號本身

\$    匹配 $ 符號本身

\.    匹配小數點(.)本身

例項

String.prototype.trim = function () {
    return this.replace(/(^\s*)|(\s*$)/g,'');
};

^表示字串必須以後面的規則開頭,而(^\s*) 表示的就是以0個空格或者多個空格開頭,後面的(\s*$) 的意思就是, 以0個空格或者多個空格結尾。

匹配特定字串

    ^[A-Za-z]+$  //匹配由26個英文字母組成的字串
    ^[A-Z]+$  //匹配由26個英文字母的大寫組成的字串
    ^[a-z]+$  //匹配由26個英文字母的小寫組成的字串
    ^[A-Za-z0-9]+$  //匹配由數字和26個英文字母組成的字串
    ^\w+$  //匹配由數字、26個英文字母或者下劃線組成的字串

評註:最基本也是最常用的一些表示式

思維導圖

JavaScript學習系列文章目錄

相關文章