JavaScript正則表達式

正則表達式（Regular Expression）使用單個字符串來描述、匹配一系列符合某個句法規則的字符串搜索模式，是用於匹配字符串中字符組合的模式。

 

一、JS 如何創建正則表達式？

 

• 通過直接量定義（隱式創建）

var str = 'I love js';
var pattern = /js/;
// test exec
console.log(pattern.test(str));     //true
console.log(pattern.exec(str));     //"js"

 

• 通過構造函數定義（顯式創建）

var str = 'I love js';
var pattern = new RegExp('js');
console.log(pattern.test(str));     //true
console.log(pattern.exec(str));     //"js"

 

 

二、正則表達式修飾符

• i：執行對大小寫不敏感的匹配（ignoreCase）
• g：執行全局匹配（global）
• m：執行多行匹配（multiline）

示例：

//字面量
var pattern = /js/i;
//構造函數
var pattern = new RegExp('js', 'i');

 

 

三、正則表達式直接量字符

• \o：NULL字符（\u0000）

• \t：制表符，即Tab（\u0009）

• \n：換行符（\u000A）

• \v：垂直制表符（\u000B）

• \f：換頁符（\u000C）

• \r：回車符（\u000D）

• \xnn：由十六進制數nn指定的拉丁字符，例如，\x0A等價於\n

• \uxxxx：由十六進制數xxxx指定的Unicode字符，例如\u0009等價於\t

• \cX：控制字符^X，例如，\cJ等價於換行符\n

示例：

//字面量
var pattern = /\t/;
//構造函數（‘\’要翻倍）
var pattern = new RegExp('\\t');

 

 

四、正則表達式錨字符

• ^：匹配字符串的開頭，在多行檢索中，匹配一行的開頭

• $：匹配字符串的結尾，在多行檢索中，匹配一行的結尾

• \b：匹配一個單詞的邊界（[\b]匹配的是退格符）

• \B：匹配非單詞邊界的位置

• (?=p)：零寬正向先行斷言，要求接下來的字符都與p匹配，但不能包括匹配p的那些字符

• (？!p)：零寬負向先行斷言，要求接下來的字符串不與p匹配

示例：

//字面量
var pattern = /[^js]/;
//構造函數
var pattern = new RegExp('[^js]');

 

 

五、正則表達式字符類

• [...]：方括號內的任意字符

• [^...]：不在方括號內的任意字符

• [a-z]：匹配a-z中任意一個字符

• [^a-z]：匹配除了a-z的任意一個字符

• .：除換行符和其他 Unicode 行終止符之外的任意字符

• \w：任何 ASCII 字符組成的單詞，等價於[a-zA-Z0-9_]

• \W：任何不是 ASCII 字符組成的單詞，等價於[^a-zA-Z0-9_]

• \s：任何 Unicode 空白符

• \S：任何非 Unicode 空白符的字符，注意\w和\S不同

• \d：任何 ASCII 數字，等價於[0-9]

• \D：除了 ASCII 數字之外的任何字符，等價於[^0-9]

• [\b]：退格直接量（特例）

示例：

//字面量（這里舉漢字的示例）
var pattern = /[\u4e00-\u9fa5]/;
//構造函數
var pattern = new RegExp('[\u4e00-\u9fa5]');

 

 

六、正則表達式重復

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

• {n, }：匹配前一項n次或者更多次

• {n}：匹配前一項n次

• ?：匹配前一項0次或者1次，也就是說前一項是可選的，等價於{0, 1}

• +：匹配前一項1次或多次，等價於{1, }

• *：匹配前一項0次或多次，等價於{0, }

示例：

var str = 'aaab';
var pattern1 = /a+/;
console.log(pattern1.exec(str));    //"aaa"
var pattern2 = /a+?/;
console.log(pattern2.exec(str));    //"a"
var pattern3 = /a+b/;
console.log(pattern3.exec(str));    //"aaab"
var pattern4 = /a+?b/;
console.log(pattern4.exec(str));    //"aaab"

 

 

七、正則表達式選擇、分組和引用

• |：選擇，匹配的是該符號左邊的子表達式或右邊的子表達式

• (…)：組合，將幾個項組合為一個單元，這個單元可通過“*”、“+”、“?”和“|”等符號加以修飾，而且可以記住和這個組相匹配的字符串以供此后的任何使用

• (?: …)：只組合，把項組合到一個單元，但是不記憶與改組相匹配的字符

• \n：和第n個分組第一次匹配的字符相匹配，組是圓括號中的子表達式（也有可能是嵌套的），組索引是從左到右的左括號數，“(?:”形式的分組不編碼

示例：

var str = 'abcd';
var pattern1 = /(ab)c/;
console.log(pattern1.exec(str));    //"abc", "ab"
var pattern2 = /(?:ab)c/;
console.log(pattern2.exec(str));    //"abc"
var pattern3 = /(ab)(c)/;
console.log(pattern3.exec(str));    //"abc", "ab", "c"
var pattern4 = /(a(b(c)))/;
console.log(pattern4.exec(str));    //"abc", "abc", "bc", "c"

var str = 'ab cd ab';
var pattern5 = /(ab) cd \1/;
console.log(pattern5.exec(str));    //"ab cd ab", "ab"

 

 

八、用於模式匹配的String方法

• search()：它的參數是一個正則表達式，返回第一個與之匹配的子串的起始位置，如果沒有匹配的子串就返回-1。如果 search() 的參數不是正則表達式，則首先會通過 RegExp 構造函數將它轉換為正則表達式，search() 不支持全局檢索，因為它忽略修飾符g。
• 示例：

var str = 'html js js';
console.log(str.search('js'));       //5

var pattern = /js/g;
console.log(str.search(pattern));    //5

 

• replace()：它用來執行檢索與替換。接收兩個參數，第一個是正則表達式，第二個是要進行替換的字符串。正則表達式如果設置的修飾符g，則進行全局替換，否則只替換匹配的第一個子串。如果第一個參數不是正則表達式，則直接搜索該字符串，而不是將其轉換為正則表達式。
  示例：

var str = 'I love js js';
console.log(str.replace('js', 'html'));       //I love html js

var pattern = /js/g;
console.log(str.replace(pattern, 'html'));    //I love html html

 

• match()：它的參數是一個正則表達式，如果不是則通過 RegExp 轉換，返回的是一個由匹配結果組成的數組。如果設置了修飾符g則進行全局匹配。
  示例：

var str = 'js js js';

var pattern = /(j)s/;
console.log(str.match(pattern));    //"js", "j"

var pattern = /(j)s/g;
console.log(str.match(pattern));    //"js", "js", "js"

 

• split()：這個方法用以將調用它的字符串拆分為一個子串組成的數組，使用的分隔符是 split() 的參數，它的參數也可以使一個正則表達式。
  示例：

var str = 'html,css,js';
console.log(str.split(','));        //"html", "css", "js"

var pattern = /,/g;
console.log(str.split(pattern));    //"html", "css", "js"

 

 

九、正則表達式RegExp對象

• 每個 RegExp 對象都有5個屬性：

1. source 是一個只讀字符串，包含正則表達式的文本。
2. global 是一個只讀布爾值，用以說明這個正則表達式是否帶有修飾符g。
3. ignoreCase 是一個只讀布爾值，用以說明這個正則表達式是否帶有修飾符i。
4. multiline 是一個只讀布爾值，用以說明這個正則表達式是否帶有修飾符m。
   示例：

var str = 'js js js';
var pattern = new RegExp('\\b', 'i');
console.log(pattern.ignoreCase);   //true
console.log(pattern.global);       //false
console.log(pattern.multiline);    //false
console.log(pattern.source);       //\b
console.log(pattern.lastIndex);    //0

5. lastIndex 是一個可讀可寫的整數，如果匹配模式帶有g修飾符，這個屬性存儲整個字符串中下一次檢索的開始位置。
   示例：

var str = 'js js js';
var pattern = /js/;
console.log(pattern.lastIndex);    //0
pattern.test(str);
console.log(pattern.lastIndex);    //0
pattern.test(str);
console.log(pattern.lastIndex);    //0
pattern.test(str);
console.log(pattern.lastIndex);    //0
pattern.test(str);
console.log(pattern.lastIndex);    //0
pattern.test(str);
console.log(pattern.lastIndex);    //0

var str = 'js js js';
var pattern = /js/g;
console.log(pattern.lastIndex);    //0
pattern.test(str);
console.log(pattern.lastIndex);    //2
pattern.test(str);
console.log(pattern.lastIndex);    //5
pattern.test(str);
console.log(pattern.lastIndex);    //8
pattern.test(str);
console.log(pattern.lastIndex);    //0
pattern.test(str);
console.log(pattern.lastIndex);    //2

 

• RegExp對象有兩個方法：

1. exec()：參數是一個字符串，功能與 match()相似，exec() 方法對一個指定的字符串執行一個正則表達式，也就是在一個字符串中執行匹配檢索。如果沒有找到任何匹配就返回 null，找到了匹配就返回一個數組，這個數組的第一個元素包含的是與正則表達式相匹配的字符串，余下的元素是與圓括號內的子表達式相匹配的子串，不論正則表達式是否有修飾符g，都會返回一樣的數組。當調用 exec() 的正則表達式對象具有修飾符g時，它將把當前正則表達式對象的 lastIndex 屬性設置為緊挨着匹配子串的字符位置。當同一個正則表達式第二次調用 exec()時，它將從 lastIndex 屬性所指示的字符串處開始檢索，如果 exec() 沒有發現任何匹配結果，它會將 lastIndex 重置為0。
   示例：

var str = 'I love js';
var pattern = /js/;
console.log(pattern.exec(str));     //"js"

 

2. test()：參數是一個字符串，用 test() 對某個字符串進行檢查，如果包含正則表達式的一個匹配結果，則返回 true 否則返回 false。
   示例：

var str = 'I love js';
var pattern = /js/;
console.log(pattern.test(str));     //true

 

• 最后附上常見的正則表達式

// 姓名
/^[\u4e00-\u9fa5]{2,4}$/

// 身份證號
/^\d{17}[0-9x]$/

// 郵箱
/^\w+@\w+.[a-zA-Z]{2,3}(.[a-zA-Z]{2,3})?$/

// 手機號
/^\d{11}$/