JavaScript正則表達式迷你書-筆記

貪婪模式：

在使用修飾匹配次數的特殊符號時，有幾種表示方法能夠使同一個表達式可以匹配不一樣的次數，好比："{m,n}", "{m,}", "?", "*", "+"，具體匹配的次數隨被匹配的字符串而定。這種重複匹配不定次數的表達式在匹配過程當中，老是儘量多的匹配

非貪婪模式：

在修飾匹配次數的特殊符號後再加上一個 "?" 號，則能夠使匹配次數不定的表達式儘量少的匹配，使可匹配可不匹配的表達式，儘量的 "不匹配"。這種匹配原則叫做 "非貪婪" 模式，也叫做 "勉強" 模式。若是少匹配就會致使整個表達式匹配失敗的時候，與貪婪模式相似，非貪婪模式會最小限度的再匹配一些，以使整個表達式匹配成功。

var regex = /\d{2,5}/g;
var string = "123 1234 12345 123456";
console.log( string.match(regex) );
// => ["123", "1234", "12345", "12345"]

其中正則 /d{2,5}/，表示數字連續出現 2 到 5 次。會匹配 2 位、3 位、4 位、5 位連續數字。 可是其是貪婪的，它會盡量多的匹配。你能給我 6 個，我就要 5 個。你能給我 3 個，我就要 3 個。 反正只要在能力範圍內，越多越好。

橫向模糊匹配

橫向模糊指的是，一個正則可匹配的字符串的長度不是固定的，能夠是多種狀況的。 其實現的方式是使用量詞。譬如 {m,n}，表示連續出現最少 m 次，最多 n 次。 好比正則 /ab{2,5}c/ 表示匹配這樣一個字符串：第一個字符是 "a"，接下來是 2 到 5 個字符 "b"，最後是字符 "c"。

var regex = /ab{2,5}c/g;
var string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";
console.log( string.match(regex) );
// => ["abbc", "abbbc", "abbbbc", "abbbbbc"]

縱向模糊匹配

縱向模糊指的是，一個正則匹配的字符串，具體到某一位字符時，它能夠不是某個肯定的字符，能夠有多種 可能。 其實現的方式是使用字符組。
譬如 [abc]，表示該字符是能夠字符 "a"、"b"、"c" 中的任何一個。 好比 /a[123]b/ 能夠匹配以下三種字符串： "a1b"、"a2b"、"a3b"。

var regex = /\d{2,5}?/g;
var string = "123 1234 12345 123456";
console.log( string.match(regex) );
// => ["12", "12", "34", "12", "34", "12", "34", "56"]
其中 /\d{2,5}?/ 表示，雖然 2 到 5 次都行，當 2 個就夠的時候，就再也不往

多選分支

一個模式能夠實現橫向和縱向模糊匹配。而多選分支能夠支持多個子模式任選其一。 具體形式以下：(p1|p2|p3)，其中 p一、p2 和 p3 是子模式，用 |（管道符）分隔，表示其中任何之一。 例如要匹配字符串 "good" 和 "nice" 能夠使用 /good|nice/。

var regex = /good|nice/g;
var string = "good idea, nice try.";
console.log( string.match(regex) );
// => ["good", "nice"]

但有個事實咱們應該注意，好比我用 /good|goodbye/，去匹配 "goodbye" 字符串時，結果是 "good"

var regex = /good|goodbye/g;
var string = "goodbye";
console.log( string.match(regex) );
// => ["good"]

而把正則改爲 /goodbye|good/，結果是：

var regex = /goodbye|good/g;
var string = "goodbye";
console.log( string.match(regex) );
// => ["goodbye"]

也就是說，分支結構也是惰性的，即當前面的匹配上了，後面的就再也不嘗試了。

反向引用

好比要寫一個正則支持匹配以下三種格式
2016-06-12
2016/06/12
2016.06.12

var regex = /\d{4}(-|\/|.)\d{2}(-|\/|.)\d{2}/;
var string1 = "2017-06-12";
var string2 = "2017/06/12";
var string3 = "2017.06.12";
var string4 = "2016-06/12";
console.log( regex.test(string1) ); // true
console.log( regex.test(string2) ); // true
console.log( regex.test(string3) ); // true
console.log( regex.test(string4) ); // true

其中 / 和 . 須要轉義。雖然匹配了要求的狀況，但也匹配 "2016-06/12" 這樣的數據。

假設咱們想要求分割符先後一致怎麼辦？此時須要使用反向引用：

var regex = /\d{4}(-|\/|.)\d{2}\1\d{2}/;
var string1 = "2017-06-12";
var string2 = "2017/06/12";
var string3 = "2017.06.12";
var string4 = "2016-06/12";
console.log( regex.test(string1) ); // true
console.log( regex.test(string2) ); // true
console.log( regex.test(string3) ); // true
console.log( regex.test(string4) ); // false

注意裏面的 1，表示的引用以前的那個分組 (-|/|.)。無論它匹配到什麼（好比 -），1 都匹配那個同 樣的具體某個字符。

咱們知道了 1 的含義後，那麼 2 和 3 的概念也就理解了，即分別指代第二個和第三個分組。

使用例子

字符串 trim 方法模擬

function trim(str) {
  return str.replace(/^\s+|\s+$/g, '');
}

表示一個 16 進制字符，能夠用字符組 [0-9a-fA-F]。 其中字符能夠出現 3 或 6 次，須要是用量詞和分支結構。 使用分支結構時，須要注意順序。 正則以下

var regex = /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})/g;
var string = "#ffbbad #Fc01DF #FFF #ffE";
console.log( string.match(regex) );
// => ["#ffbbad", "#Fc01DF", "#FFF", "#ffE"]