一源请、 什么是正則表達(dá)式
1、 概述
<body>
<img src="1.png" alt="">
</body>
<script>
var img = document.querySelector('img');
img.onclick = function(){
if(this.src.indexOf("1.png") > 0){
this.src = "2.jpg";
}else{
this.src = "1.png";
}
}
</script>
以上代碼中铲球，在判斷時挺庞，用到了 標(biāo)準(zhǔn)庫中 string 對象的indexOf()方法；
用于確定一個字符串在另一個字符串中的位置稼病，返回一個整數(shù)选侨，表示匹配開始的位置。如果返回-1然走，就表示未匹配援制；
由此可以看出，indexOf的作用就是查找字符串芍瑞；
而在真實的項目開發(fā)中晨仑，字符串的查找操作，是非常普遍的拆檬；
比如洪己，判斷密碼中是否有數(shù)字及字母、手機(jī)號是否為11為數(shù)字等等……
要完成這些復(fù)雜的查找操作秩仆，我們需要借助另外的工具码泛，這就是我們要學(xué)習(xí)的 正則表達(dá)式猾封；
正則表達(dá)式(regular expression)描述了一種字符串匹配的模式澄耍，可以用來檢查一個串是否含有某種子串、
將匹配的子串做替換或者從某個串中取出符合某個條件的子串等。
每一門計算機(jī)編程語言齐莲，都支持正則表達(dá)式
正則表達(dá)式都能幫我們做什么痢站？
數(shù)據(jù)隱藏（188****520 李先生）
數(shù)據(jù)采集（數(shù)據(jù)爬蟲）
數(shù)據(jù)過濾（論壇敏感詞過濾）
數(shù)據(jù)驗證（表單驗證、手機(jī)號碼选酗、郵箱地址...）
2阵难、 入門
驗證一個字符串中是否有數(shù)字 8 ；
var t = 'sda43645dfgkl';
//定義一個正則
var reg = /8/;
//判斷字符串是否符合表達(dá)式的定義
alert(reg.test(t)); //false
以上代碼中芒填，字符串中沒有數(shù)字 8 ,因此檢測結(jié)果為 flase ;
var t = 'sda43645dfgkl';
//定義一個正則
var reg = /\d/;
//判斷字符串是否符合表達(dá)式的定義
alert(reg.test(t)); //true
\d 是 字符簇 呜叫，表示0-9的數(shù)字； 后面講解什么是 字符簇
二殿衰、 在JavaScript中使用正則
1朱庆、 創(chuàng)建正則對象
1：字面量寫法-以斜杠表示開始和結(jié)束； var regex = /xyz/;
2：內(nèi)置構(gòu)造函數(shù)生成-通過實例化得到對象闷祥；var regex = new RegExp('xyz');
上面兩種寫法是等價的娱颊，都新建了一個內(nèi)容為 xyz 的正則表達(dá)式對象。
var t = 'sda43645dfgkl';
var reg = /\d/; //字面量
var reg = new RegExp(/\d/); //構(gòu)造函數(shù)
console.log(reg.test(t));
考慮到書寫的便利和直觀凯砍，實際應(yīng)用中箱硕，基本上都采用字面量的寫法。
2悟衩、 正則對象的方法
test(str) ：判斷字符串中是否具有指定模式的子串剧罩，返回結(jié)果是一個布爾類型的值;
**exec(str) **：返回字符串中指定模式的子串，一次只能獲取一個與之匹配的結(jié)果;
<body>
<input type="text" id="inp">
<input type="button" id="btu" value="匹配">
</body>
<script>
var btu = document.querySelector('#btu');
btu.onclick = function(){
var t = document.querySelector('#inp').value;
var reg = /\d\d\d/;
console.log(reg.test(t));//返回是否匹配成功的布爾值
console.log(reg.exec(t));//返回匹配后的結(jié)果座泳，匹配失敗返回null
}
</script>
3斑响、 String對象的方法
search(reg) ：與indexOf非常類似，返回指定模式的子串在字符串首次出現(xiàn)的位置
match(reg) ：以數(shù)組的形式返回指定模式的字符串钳榨，可以返回所有匹配的結(jié)果
replace(reg,’替換后的字符’) ：把指定模式的子串進(jìn)行替換操作
split(reg) ：以指定模式分割字符串舰罚，返回結(jié)果為數(shù)組
<body>
<input type="text" id="inp">
<input type="button" id="btu" value="匹配">
</body>
<script>
var btu = document.querySelector('#btu');
btu.onclick = function(){
var t = document.querySelector('#inp').value;
var reg = /\d\d\d/;
//返回第一次出現(xiàn)符合的字符串的位置
console.log(t.search(reg));
//數(shù)組形式返回符合規(guī)則的字符串,使用g則返回全部匹配結(jié)果
console.log(t.match(reg));
//替換符合規(guī)則的字符串，使用g則全部替換
console.log(t.replace(reg,'***'));
//以規(guī)則為分割標(biāo)志薛耻，分割整個字符串营罢，以數(shù)組形式返回分割結(jié)果
console.log(t.split(reg));
}
</script>
三、幾個重要的概念
子表達(dá)式
在正則表達(dá)式中饼齿，通過一對圓括號括起來的內(nèi)容饲漾，我們就稱之為“子表達(dá)式”。如：
var reg = /\d(\d)\d/gi;
捕獲
在正則表達(dá)式中缕溉，子表達(dá)式匹配到相應(yīng)的內(nèi)容時考传，系統(tǒng)會自動捕獲這個行為，
然后將子表達(dá)式匹配到的內(nèi)容放入系統(tǒng)的緩存區(qū)中证鸥。我們把這個過程就稱之為“捕獲”僚楞。
反向引用
在正則表達(dá)式中勤晚，我們可以使用\n（n>0，正整數(shù)泉褐，代表系統(tǒng)中的緩沖區(qū)編號）
來獲取緩沖區(qū)中的內(nèi)容赐写，我們把這個過程就稱之為“反向引用”。
這些比較重要的概念膜赃，在什么情況下可能被用到挺邀？
例：查找連續(xù)的相同的四個數(shù)字，如:1111跳座、6666
var str = 'gh2396666j98889';
// 1:子表達(dá)式匹配數(shù)組
// 2:發(fā)生捕獲行為端铛，把子表達(dá)式匹配的結(jié)果放入緩存區(qū)
// 3:使用反向引用獲取緩存中的結(jié)果進(jìn)行匹配
var reg = /(\d)\1\1\1/;
console.log(str.match(reg));
練習(xí)
例1：查找連續(xù)的四個數(shù)字，如：3569
答：var reg = /\d\d\d\d/gi;
例2：查找數(shù)字疲眷，如：1221,3443
答：var reg = /(\d)(\d)\2\1/gi;
例3：查找字符沦补，如：AABB,TTMM
（提示：在正則表達(dá)式中，通過[A-Z]匹配A-Z中的任一字符）
答：var reg = /([A-Z])\1( [A-Z])\2/g;
例4：查找連續(xù)相同的四個數(shù)字或四個字符
（提示：在正則表達(dá)式中咪橙，通過[0-9a-z]）
答：var reg = /([0-9a-z])\1\1\1/gi;
四夕膀、 編寫正則表達(dá)式
1、 正則表達(dá)式組成
正則表達(dá)式是由普通字符（例如字符 a 到 z）以及特殊字符（稱為元字符）組成的文字模式美侦。
正則表達(dá)式作為一個模板产舞，將某個字符模式與所搜索的字符串進(jìn)行匹配。
正則表達(dá)式三步走
① 匹配符（查什么）
② 限定符（查多少）
③ 定位符（從哪查）
2菠剩、 匹配符（查什么）
匹配符：字符匹配符用于匹配某個或某些字符易猫；
前面用到的 \d 就是匹配一個 0-9 的數(shù)字
在正則表達(dá)式中，通過一對中括號括起來的內(nèi)容具壮，我們就稱之為“字符簇”准颓。
字符簇代表的是一個范圍，但是匹配時棺妓，只能匹配某個范圍中固定的結(jié)果攘已。
| 字符簇 | 含義 |
|---|---|
| [a-z] | 匹配字符a到字符z之間的任一字符 |
| [A-Z] | 匹配字符A到字符Z之間的任一字符 |
| [0-9] | 匹配數(shù)字0到9之間的任一數(shù)字 |
| [0-9a-z] | 匹配數(shù)字0到9或字符a到字符z之間的任一字符 |
| [0-9a-zA-Z] | 匹配數(shù)字0到9或字符a到字符z或字符A到字符Z之間的任一字符 |
| [abcd] | 匹配字符a或字符b或字符c或字符d |
| [1234] | 匹配數(shù)字1或數(shù)字2或數(shù)字3或數(shù)字4 |
在字符簇中，通過一個^(脫字符)來表示取反的含義怜跑。
| 字符簇 | 含義 |
|---|---|
| [^a-z] | 匹配除字符a到字符z以外的任一字符 |
| [^0-9] | 匹配除數(shù)字0到9以外的任一字符 |
| [^abcd] | 匹配除a样勃、b、c性芬、d以外的任一字符 |
元字符 (常用)
| 字符簇 | 含義 |
|---|---|
| \d | 匹配一個數(shù)字字符峡眶，與使用[0-9]等價 |
| \D | 匹配一個非數(shù)字字符，還可以使 [^0-9] |
| \w | 匹配包括下劃線的任何字母數(shù)字下劃線字符植锉，還可以使用 [0-9a-zA-Z_] |
| \W | 匹配任何非字母數(shù)字下劃線字符辫樱，還可以使用[^\w] |
| \s | 匹配任何空白字符 |
| \S | 匹配任何非空白字符，還可以使用[^\s] |
| . | 匹配除 "\n" (換行符) 之外的任何單個字符 |
| [\u4e00-\u9fa5] | 匹配中文 字符 |
var str = 'gh23.9h西688嶺8老4濕9';
var reg = /\w/;//匹配數(shù)字字母下劃線
console.log(str.match(reg));
var reg = /[4-8]/;//匹配4-8的數(shù)字
console.log(str.match(reg));
var reg = /./;//匹配除 "\n" 之外的任何單個字符
console.log(str.match(reg));
var reg = /./;//匹配除 "\n" 之外的任何單個字符
console.log(str.match(reg));
var reg = /[\u4e00-\u9fa5]/; //匹配中文字符中的任一字符
console.log(str.match(reg));
3俊庇、 限定符（查多少）
什么是限定符狮暑？
限定符可以指定正則表達(dá)式的一個給定字符必須要出現(xiàn)多少次才能滿足匹配鸡挠。
* ：匹配前面的子表達(dá)式零次或多次，0到多
+ ：匹配前面的子表達(dá)式一次或多次心例，1到多
? ：匹配前面的子表達(dá)式零次或一次宵凌，0或1
{n} ：匹配確定的 n 次
{n,} ：至少匹配 n 次
{n,m} ：最少匹配 n 次且最多匹配 m 次
對QQ號碼進(jìn)行校驗要求5~11位,不能以0開頭,只能是數(shù)字
var str = '我的QQ20869921366666666666鞋囊，nsd你的是6726832618嗎止后？';
var reg = /[1-9]\d{4,10}/g;
console.log(str.match(reg));
我們會發(fā)現(xiàn)以上代碼運行結(jié)果中，默認(rèn)優(yōu)先配到 13 位溜腐，在對后面的進(jìn)行匹配译株；
為什么不是優(yōu)先匹配 5 位后，在對后面的進(jìn)行匹配呢挺益？
因為在正則表達(dá)式中歉糜，默認(rèn)情況下，能匹配多的就不匹配少的望众，
我們把這種匹配模式就稱之為 貪婪匹配,也叫做 貪婪模式
所有的正則表達(dá)式匪补，默認(rèn)情況下采用的都是貪婪匹配原則。
如果在限定符的后面添加一個問號烂翰？夯缺，
那我們的貪婪匹配原則就會轉(zhuǎn)化為非貪婪匹配原則，優(yōu)先匹配少的甘耿，也叫惰性匹配踊兜；
var str = '我的QQ20869921366666666666，nsd你的是6726832618嗎佳恬？';
//非貪婪模式匹配捏境，
var reg = /[1-9]\d{4,12}?/g;
console.log(str.match(reg));
4、 定位符（從哪查）
編寫正則表達(dá)式毁葱，匹配手機(jī)號碼垫言？（注冊功能）
純數(shù)字
第一位必須是1開頭
第二位必須是3、4倾剿、5骏掀、7、8
第三位~第十一只要是數(shù)字即可
var str = 'lsd15309873475';
var reg = /1[34578]\d{9}/;
console.log(reg.test(str));//結(jié)果true
檢測結(jié)果為真柱告，但是截驮，字符串并不是一個手機(jī)號；
正則表達(dá)式只會到字符串去尋找是否有與之匹配的結(jié)果际度，如果有葵袭，
就認(rèn)為是正確的，而不考慮其字符串本身是否合法乖菱。
如何解決以上問題呢坡锡？
定位符可以將一個正則表達(dá)式固定在一行的開始或結(jié)束蓬网。
也可以創(chuàng)建只在單詞內(nèi)或只在單詞的開始或結(jié)尾處出現(xiàn)的正則表達(dá)式。
^ (脫字符)：匹配輸入字符串的開始位置
$ ：匹配輸入字符串的結(jié)束位置
\b ：匹配一個單詞邊界
\B ：匹配非單詞邊界
注意: ^ 放在字符簇中是取反的意思鹉勒，放在整個表達(dá)式中是開始位置帆锋；
var str = 'lsd15309873475';
var reg = /^1[34578]\d{9}$/;
console.log(reg.test(str));//false
var str = 'i am zhangsan';
//an必須是一個完整的單詞
var reg = /\ban\b/;
console.log(str.match(reg));
//an不能是單詞的開始，只能是單詞的結(jié)束
var reg = /\Ban\b/;
console.log(str.match(reg));
5禽额、 匹配模式 & 修飾符
匹配模式也就修飾符：
表示正則匹配的附加規(guī)則锯厢，放在正則模式的最尾部。
修飾符可以單個使用脯倒，也可以多個一起使用实辑。
在正則表達(dá)式中，匹配模式常用的有兩種形式：
g ：global縮寫藻丢，代表全局匹配剪撬，匹配出所有滿足條件的結(jié)果，不加g第一次匹配成功后悠反，正則對象就停止向下匹配;
i ：ignore縮寫残黑，代表忽略大小寫，匹配時斋否，會自動忽略字符串的大小寫
語法：
var reg = /正則表達(dá)式/匹配模式;
var t = 'sda43645dfgkl';
var reg = /Da/; //匹配結(jié)果為false
var reg = /Da/i; //匹配結(jié)果為ture
console.log(reg.test(t));
6梨水、 轉(zhuǎn)義字符
因為在正則表達(dá)式中 .(點) + \ 等是屬于表達(dá)式的一部分，但是我們在匹配時如叼，字符串中也需要匹配
這些特殊字符冰木，所以，我們必須使用 *反斜杠* 對某些特殊字符進(jìn)行轉(zhuǎn)義笼恰；
需要轉(zhuǎn)義的字符：
點號.
小括號()
中括號[]
左斜杠/
右斜杠\
選擇匹配符|
*
?
{}
+
$
^
匹配一個合法的網(wǎng)址URL：
var str = 'http://xiling.me';
// 對于 . / 都必須轉(zhuǎn)義匹配
var reg = /\w+:\/\/\w+\.\w+/;
console.log(str.match(reg));
使用正則表達(dá)式驗證郵箱是否合法
var str = 'qq@qq.com';
var reg = /\w+@[0-9a-z]+(\.[0-9a-z]{2,6})+/;
console.log(str.match(reg));
7踊沸、 或者的用法
查找所有屬于蘋果旗下的產(chǎn)品
var str = 'ipad,iphone,imac,ipod,iamsorry';
var reg = /\bi(pad|phone|mac|pod)\b/g;
console.log(str.match(reg));
