一些很基礎(chǔ)的東西如果不精讀也會(huì)導(dǎo)致使用中掉入“陷阱”，甚至自己還沒意識(shí)到，我曾在這犯了一些錯(cuò)誤，因此特別留意，這是我關(guān)于 JavaScript 正則表達(dá)式里面的管道符 | 一些理解。

正則表達(dá)式里面的管道符|表示將符號(hào)兩個(gè)匹配條件進(jìn)行邏輯“或”（Or）運(yùn)算，例如/a|b/可以匹配字符串a或者字符串b。

看起來很簡(jiǎn)單，但是使用起來跟待匹配的字符串循序有關(guān)，查找的循序是按照匹配條件左邊開始到右邊匹配，但是返回的結(jié)果是按照待匹配的字符串的字符順序（從左到右）的第一個(gè)匹配結(jié)果進(jìn)行輸出。并且第一條件被匹配到字符串之后，后面的條件是在原來字符串減去已經(jīng)匹配到的字符之后再進(jìn)行查找匹配。

可能文字看起來比較懵，這里使用一些例子，利用字符串的match()方法進(jìn)行輸出匹配結(jié)果來進(jìn)行分析。

"aaabbbccc".match(/aa|bb|cc/g);  //Array [ "aa", "bb", "cc" ]

上面的輸出結(jié)果是毫無疑問的，那么把匹配條件的循序換成/cc|bb|aa/呢？

"aaabbbccc".match(/cc|bb|aa/g); //Array [ "aa", "bb", "cc" ]

輸出結(jié)果并非按照匹配循序來，依然跟上面的一樣。這是因?yàn)榇ヅ涞淖址?code>aaabbbccc中，aa在前面，不管條件的排序是怎么樣的，輸出結(jié)果依然是按照原來的字符串循序來。

那么是不是匹配條件的循序沒有關(guān)系呢？我們看看下面例子：

"aaabbbccc".match(/ab|a/g); //Array [ "a", "a", "ab" ]

結(jié)果有點(diǎn)有趣，它先按照條件的循序先尋找ab，再尋找a，找到了1個(gè)ab之后繼續(xù)在剩下（而不是全部字符串）的字符串aabbccc的基礎(chǔ)上再查找a，因此找到了2個(gè)a，但是作為匹配結(jié)果返回的時(shí)候是按照原來的字符串循序進(jìn)行返回，因此返回結(jié)果是2個(gè)a在前。

下面代碼的運(yùn)行結(jié)果也說明匹配條件的循序的重要性：

"aaabbbccc".match(/a|ab/g); //Array [ "a", "a", "a" ]

找到3個(gè)a也找不出一個(gè)ab，原因在于查找條件是先查找a，它找到了3個(gè)a之后再在剩下的字符串bbbccc上找ab，因此一個(gè)ab都匹配不到。

因此正則表達(dá)式的管道符|兩邊的匹配條件循序很重要，并且要根據(jù)需要匹配的字符串的字符順序來確定匹配條件的順序，一旦不注意會(huì)造成意想不到的結(jié)果，并且很難發(fā)現(xiàn)。