一些很基础的东西如果不精读也会导致使用中掉入“陷阱”，甚至自己还没意识到，我曾在这犯了一些错误，因此特别留意，这是我关于 JavaScript 正则表达式里面的管道符 | 一些理解。
正则表达式里面的管道符|表示将符号两个匹配条件进行逻辑“或”（Or）运算，例如/a|b/可以匹配字符串a或者字符串b。
看起来很简单，但是使用起来跟待匹配的字符串循序有关，查找的循序是按照匹配条件左边开始到右边匹配，但是返回的结果是按照待匹配的字符串的字符顺序（从左到右）的第一个匹配结果进行输出。并且第一条件被匹配到字符串之后，后面的条件是在原来字符串减去已经匹配到的字符之后再进行查找匹配。
可能文字看起来比较懵，这里使用一些例子，利用字符串的match()方法进行输出匹配结果来进行分析。
"aaabbbccc".match(/aa|bb|cc/g); //Array [ "aa", "bb", "cc" ]
上面的输出结果是毫无疑问的，那么把匹配条件的循序换成/cc|bb|aa/呢？
"aaabbbccc".match(/cc|bb|aa/g); //Array [ "aa", "bb", "cc" ]
输出结果并非按照匹配循序来，依然跟上面的一样。这是因为待匹配的字符串aaabbbccc中，aa在前面，不管条件的排序是怎么样的，输出结果依然是按照原来的字符串循序来。
那么是不是匹配条件的循序没有关系呢？我们看看下面例子：
"aaabbbccc".match(/ab|a/g); //Array [ "a", "a", "ab" ]
结果有点有趣，它先按照条件的循序先寻找ab，再寻找a，找到了1个ab之后继续在剩下（而不是全部字符串）的字符串aabbccc的基础上再查找a，因此找到了2个a，但是作为匹配结果返回的时候是按照原来的字符串循序进行返回，因此返回结果是2个a在前。
下面代码的运行结果也说明匹配条件的循序的重要性：
"aaabbbccc".match(/a|ab/g); //Array [ "a", "a", "a" ]
找到3个a也找不出一个ab，原因在于查找条件是先查找a，它找到了3个a之后再在剩下的字符串bbbccc上找ab，因此一个ab都匹配不到。
因此正则表达式的管道符|两边的匹配条件循序很重要，并且要根据需要匹配的字符串的字符顺序来确定匹配条件的顺序，一旦不注意会造成意想不到的结果，并且很难发现。
网友评论