我們知道js是支持正則表達(dá)式的己英，用正則表達(dá)式來驗(yàn)證文本非常方便迎瞧，但是初學(xué)者卻非常難懂夸溶，最近碰到幾個(gè)要用正則的地方，實(shí)在是逃不過了就去學(xué)了學(xué)凶硅，發(fā)現(xiàn)邊寫邊學(xué)其實(shí)也并不是太難缝裁。下面通過一個(gè)案例來學(xué)習(xí)
ps:安利兩個(gè)網(wǎng)站正則可視化 正則檢測(cè) 下面講用法
先看需求：匹配美國(guó)電話號(hào)碼
//正確格式
555-555-5555
(555)555-5555
(555) 555-5555
555 555 5555
5555555555
1 555 555 5555
首先會(huì)想到匹配數(shù)字，發(fā)現(xiàn)正則數(shù)字可以用\d表示足绅，那么\d\d\d-\d\d\d-\d\d\d\d是不是可以匹配第一種類型呢捷绑，來用這個(gè)網(wǎng)站檢測(cè)一下，可以看到第一個(gè)確實(shí)被匹配到了氢妈，后面/g是全文匹配
但是缺點(diǎn)顯而易見粹污，重復(fù)的怎么簡(jiǎn)寫呢？原來{n}可以表示重復(fù)次數(shù)首量，那么改一下
Bingo!,那么接下來注意到第一個(gè)壮吩，第四個(gè)是不是比較相同呢？空格或者橫線加缘，那么怎么表示或者關(guān)系呢鸭叙？來看看這個(gè),框起來的是更改的地方
沒錯(cuò)[]表示或者的關(guān)系，\s表示空格拣宏。來用可視化看一下
意思就是3個(gè)數(shù)字沈贝，接著匹配空格或則橫線，再3個(gè)數(shù)字勋乾，再空格或則橫線宋下，最后4個(gè)數(shù)字，這樣應(yīng)該很好理解了
可能會(huì)注意到222 555 555 5555這樣不符合預(yù)期的也匹配到了辑莫，原來我們是想從頭開始驗(yàn)證杨凑，那么可以這樣做
用^表示從頭開始匹配，注意到后面加了/gm,因?yàn)榧恿藦念^匹配的話摆昧，回車換行下一行并不會(huì)被認(rèn)為新的開始，所以/m表示多行匹配
然后看5555555555空格和橫線也可以不要蜒程，那么意思就是空格或橫線可以出現(xiàn)或者不出現(xiàn)绅你，那么可以這樣改一下
注意我加了一個(gè)
?伺帘，它表示最多出現(xiàn)一次（可以是0次）這樣就可以匹配全是數(shù)字這樣的情況了，舉一反三忌锯，那么開始的區(qū)號(hào)1 555 555 5555中的1和空格是不是也可以這樣表示呢伪嫁？
注意我用
()括起來了，它表示一組接下來處理括號(hào)偶垮，既然也是可有可無(wú)张咳，也用
?表示算了
注意框起來的地方我寫的是
\(和\)這是因?yàn)?strong>要對(duì)特殊字符進(jìn)行轉(zhuǎn)義，學(xué)過js一定對(duì)轉(zhuǎn)義不陌生似舵，這里就不細(xì)講了到這里就完了嗎脚猾？不不不，還是太年輕砚哗，來看看這種情況
我們寫的是括號(hào)兩邊都是最多出現(xiàn)一次龙助，并沒有要求同時(shí)出現(xiàn)或者同時(shí)不出現(xiàn)，這就面臨著只出現(xiàn)一半也會(huì)通過匹配的情況蛛芥。提鸟。再改一下
這好像改的有點(diǎn)多。仅淑。
分步講称勋，先看前面由(1\s)?改成了1?\s?因?yàn)闆]改之前(1\s)是一組至多出現(xiàn)一次，所以1單獨(dú)出現(xiàn)的時(shí)候也會(huì)出現(xiàn)匹配失敗涯竟，所以還是分開寫了
再看第二個(gè)這一坨赡鲜，放到可視化里面看
兩組之間的或者關(guān)系可以用()|()表示
最后一步，我加了$來表示結(jié)尾昆禽，停止匹配蝗蛙，不然的話555-555-5555555也是會(huì)被匹配成功的
大致就是這么多了，最后來完整看一遍代碼
/^1?\s?((\(\d{3}\))|(\d{3}))[\s-]?\d{3}[\s-]?\d{4}$/gm
放到可視化里面
常用的正則方法還有
[a-z] //匹配a到z任意字符
. //除回車換行外任意字符
+//最少出現(xiàn)一次
\d//數(shù)字
\D//非數(shù)字
\s//空格
\S//非空格
\w//單詞字符
\W//非單詞字符
{n}//出現(xiàn)n次
{n,m}//出現(xiàn)n到m次
{n,}//至少出現(xiàn)n次
\b//單詞邊界
\B//非單詞邊界
