創建正則表達式
1.使用new來創建
var exp = new RegExp('box' , 'gi' );
g 全局匹配
i 忽略大小寫
m 多行匹配
2.使用字面量
var exp =/box/gi;
直接用2個 / ;
在倆個斜杠后加上模式修飾符;
倆種創建方式比較:
1.使用字面量方式創建用的更加廣泛;
2.當要匹配的內容是變量時,只能使用new來創建.
正則表達式的測試
1.test( )
正則表達式對象.test(字符串)
參數:要匹配的字符串
返回值:匹配成功返回true,失敗返回false
例1:
var exp = /Box/i;
var str = 'box' ;
alert(exp.test(str));
=> true 忽略大小寫 ;
例2:
var exp = /abc/g;
var str = 'abcab';
var res = exp.test(str);
console.log(res);
console.log(exp.test(str));
console.log(exp.test(str));
=> true //從第一個開始匹配,匹配到了abc 返回true;
=> false //由于開啟了全局匹配,所以從上次匹配之后的位置開始匹配(也就是從第二個a開始); 若沒有g 則每次都會從頭開始匹配
=> true //由于上次匹配是false并且已經將字符串str查找完了,所以又從頭開始匹配
注:
? 開啟了全局匹配g后,正則表達式內部有一個lastIndex的屬性,用以記錄下次開始查找的下標,保證其每次從lastIndex的位置開始查找
例3:
var exp = /abc/g; //同一正則表達式匹配不同字符串
var str1 = 'abc';
var str2 = 'abcab';
console.log(exp.test(str1));
console.log(exp.test(str2));
=> true; //從str1的0位開始匹配,匹配到了abc,返回true, 此時lastIndex為3
=> false; //從str2中lastIndex的位置開始匹配,也就是從第二個a開始
例4:
var exp1 = /abc/g; //不同正則表達式匹配同一字符串
var exp2 = /abc/g;
var str = 'abc';
console.log(exp1.test(str));
console.log(exp2.test(str));
=> true; //從str1的0位開始匹配,匹配到了abc,返回true
=> true; //從str1的0位開始匹配,返回true
2.exec( )
exec(字符串):該方法為專門為捕獲組而設計的
參數:要匹配的字符串
返回值:返回的是一個數組。如果不匹配則返回null
關于返回值數組的說明:
它確實是Array的實例。
但是這個數組有兩個額外的屬性:index和 input
index:表示匹配的字符串在源字符串中的索引
input:表示匹配的源字符串。
數組的第一項是與整個模式匹配的字符串,其他項是與模式中捕獲組匹配的字符串
如果沒有捕獲組,則數組中只有第一項。關于捕獲組的概念以后再說
例1:var exp = /abc/gi;var str = "aaabcccdabcAbcAdaBc";var strNew = "";while (strNew=exp.exec(str)){ //使用while循環,將所有匹配到字符串輸出來console.log(strNew[0]) //由于返回的是一個帶有很多屬性的數組,所以我們只要數組中的字符串,也就是索引為0.}
正則表達式的規則
字符類:單個字母數字下劃線
. //匹配除換行符外的任意字符(當點放在[]中是,沒有特殊意義)
var exp = /\d/g; // [0-9]
var exp = /\D/g; //[^0-9]
var exp = /\w/g; //[a-zA-Z0-9_];
var exp = /\W/g; //[^a-zA-Z0-9_];
字符類:空白字符
\0 匹配null 字符
\b 匹配退格字符
\n 匹配換行符
\r 匹配回車字符
\t 匹配制表符
\s 匹配空白字符、空格、制表符和換行符
\S 匹配非空白字符
單詞邊界
\b
示例
/\bcat\b/ 匹配到cat這個單詞
/B 非單詞邊界
元字符/元符號 匹配情況
^ 行首匹配
$ 行尾匹配
字符類:重復字符
元字符/元符號 匹配情況
? 例如(x?) 匹配0個或1 個x
* 例如(x*) 匹配0個或任意多個x
+ 例如(x+) 匹配至少一個x
(xyz)+ 匹配至少一個(xyz)
{m,n} 例如x{m,n} n>=次數>=m 匹配最少m個、最多n個x
{n} 匹配前一項n次
{n,} 匹配前一項n次,或者多次
1.[ ]
匹配[ ]內的任意一個字符
var exp = /[abc]/gi; // []內代表匹配其中的一個字符: a 或 b 或 c
var exp = /[a-zA-Z0-9_$]/g; //匹配26個大小寫字母,0-9數字,下劃線_ 美元符$ 中的任意一個;
var exp = /[^a-zA-Z]/g //匹配任意不在括號中的字符集中的字符;
[ ]也可以配合? * + {} 來使用; 如[a-z]+ 匹配至少一個[a-z]范圍內的任意一個;
2. ^
倆種用法:
1.放在[ ] 內 表示非
var exp = /[^a-zA-Z]/g //匹配任意不在括號中的字符集中的字符;
2.放在[ ] 外,表示行首匹配
var exp = /^\d/g; //規定行首必須是數字
var str = '123qq';
console.log(exp.test(str)); //行首為數字1,返回true;
console.log(exp.lastIndex); //此時lastIndex 為1
console.log(exp.test(str)); //從下標為1的位置開始匹配,雖然下標為1的位置是數字,但卻不是行首,返回false;
3. $
表示行尾匹配,用法與^ 相近
^ 和 $ 合用
var exp = /^\d\d$/g; //規定行首和行尾必須是數字
var str = '12';
var str2 = '123';console.log(exp.test(str)); // trueconsole.log(exp.lastIndex); // 2console.log(exp.test(str)); //falseconsole.log(exp.lastIndex); //0console.log(exp.test(str)); //trueconsole.log(exp.test(str2)); //false //exp中規定了行首行尾為數字,中間無內容
4. .
匹配除換行符外的任意字符(當點放在[ ]中是,沒有特殊意義)
var exp = /./g;
var str = 'a';
console.log(exp.test(str));
=> true
若想匹配它本身.
var exp = /\./g;
5. |
擇一匹配(管道符號) 表示或
var exp = /a|b/g;
var str = 'a';
console.log(exp.test(str));
=> true
數量詞的匹配:默認都是貪婪匹配
6. ?
匹配0個或者1個
7. *
匹配0個或者多個
var exp = /a*/g;
var str = 'aaaaa';console.log(exp.test(str)); //trueconsole.log(exp.test(str)); //true
8. +
匹配1個或多個
var exp = /a+/g;
var str = 'aaaaa';console.log(exp.test(str)); //trueconsole.log(exp.test(str)); //false
9. {n}
匹配n個,只能是n個
10. {n,}
匹配至少n個
11. {n,m}
匹配至少n個,最多m個
基本的正則表達式驗證
寫一個正在表達式,判斷手機號是否合法
var exp = /1[34578]\d{9}$/g;
var str = '13979318939';console.log(exp.test(str));
=> true
寫一個正在表達式,判斷郵箱是否合法
var exp = /^\w{3,15}@[\w-]+\.(com|cn|net|org|edu|com\.cn)$/gi;
var str = '133_d@cn.com.cn';console.log(exp.exec(str)[0]);
=> 133_d@cn.com.cn
寫一個正則表達式,判斷圖片的地址是否合法
var exp = /^(http|https):\/\/.+\.(jpg|jpeg|gif|png)$/gi;
var str = 'http://3323498dsfledf.png';console.log(exp.exec(str)[0]);
=> http://3323498dsfledf.png
寫一個正則表達式,爬取一堆字符串中的所有圖片地址
var exp = /http:\/\/[^:]+\.(jpg|jpeg|gif|png)/gi;
寫一個正則表達式,將字符串中的重復去掉
var exp = /(.)\1+/gi;
var str = "aabbccdd"; console.log(str.replace(exp,'$1'));
=> abc
分組
其中分組體現在:所有以(和)元字符所包含的正則表達式被分為一組,每一個分組都是一個子表達式,它也是構成高級正則表達式的基礎。如果只是使用簡單的(regex)匹配語法本質上和不分組是一樣的,如果要發揮它強大的作用,往往要結合回溯引用的方式。var str = '123-mm';
var strReg = str.replace(/(\d+)-([A-Za-z]+)/g,'$2');
console.log(strReg)//mm 上面那段$2這個就是表示正則第二組個匹配到的內容
?
方法
1.search( )
str.search(exp);檢索與正則表達式相匹配的第一個匹配項的索引。返回值: 索引 ,沒有返回-1;
注:search( )不支持全局,每次調用總是從0開始查找.加不加g都一樣
2.match( )
str.match(exp);把滿足正則表達式的所有字符串一起返回返回值: 數組 ,沒有返回null;var str = "abc134ABC244co9";console.log(str.match(/\d+/gi)); //獲取str中的所有數字的數組
=> ["134","244","9"]
注:如果想獲取所有的滿足的,應該使用全局g,使用全局的時候,分組的信息則拿不到
3.replace( )
str.replace(exp,newStr);將正則表達式替換返回值: 替換之后的字符串var str = "123aaa244";console.log(str.replace(/\d/gi,"")); //將str中的數字全部去掉
=> aaa 寫一個正則表達式,將字符串中的重復去掉
var exp = /(.)\1+/gi;
var str = "aabbccdd"; console.log(str.replace(exp,'$1'));
=> abc
4.split( )
str.split(exp,length);length:可選參,切出來的數組的最大長度使用split 拆分成字符串數組返回替換之后的字符串var str = "102dsfe00dfefsf55";
var exp = /\D+/gi; //用所有非數字來切割console.log(str.split(exp));
=> ["102","00","55"]
https://www.cnblogs.com/moqing/archive/2016/07/13/5665126.html
?
?
/*** @description:萬能判斷* @param {type}* value/判斷的焦點* type: 1/false(默認undefind也是false) 2/與焦點比對類型(小寫)* @return:1/焦點類型(小寫) 2/boolean*/
function checkType(value, type) {const prototypeString = Object.prototype.toString.call(value)const typeString = prototypeString.replace(/\S*\s|]/gi, '').toLowerCase()return type ? type == typeString : typeString
}
export default checkType
?
匹配出現a或者b組合一起至少3次以上/(a|b){3,}/,匹配aaa,bbb,aab,baa,bba,bab等等
?
?
?
正則表達式------捕獲性分組,非捕獲性分組,前瞻,后瞻捕獲性分組
javascript中捕獲性分組是以小括號()來實現,捕獲性分組工作模式()會把每個分組里匹配的值保存起來。比如利用捕獲性分組把 hello world 互換成 world hello:方法一:通過exec函數var str = 'hello world'; //首先創建好字符串
var pattern = /([a-z]+)\s([a-z]+)/; //先通過正則匹配這個字符串,用分組模式來獲取這兩個單詞
var arr = pattern.exec(str); // exec方法返回的是一個數組,包含匹配到的字符串以及分組(也稱子串)里的值console.log(arr); //['hello world','hello','world']
console.log(arr[0]); //'hello world' 匹配到的字符串
console.log(arr[1]); //'hello' 第一個分組([a-z]+)的值
console.log(arr[2]); //'world' 第二個分組([a-z]+)的值//這時候兩個分組的值都得到了,接下來用字符串拼接法實現互換
var n_str = arr[2]+' '+arr[1];
console.log(n_str) //world hello方法二:通過屬性$1-9var str = 'hello world';
var pattern = /([a-z]+)\s([a-z]+)/;
pattern.test(str); //這個地方必須運行正則匹配一次,方式不限,可以是test()、exec()、以及String的正則方式console.log(RegExp.$1) //'hello' 第一個分組([a-z]+)的值
console.log(RegExp.$2) //'world' 第二個分組([a-z]+)的值var n_str = RegExp.$2+' '+RegExp.$1;
console.log(n_str) //world hello方法三:通過String的replace()var str = 'hello world';
var pattern = /([a-z]+)\s([a-z]+)/;
var n_str = str.replace(pattern,"$2 $1"); //這里的$1、$2與方法二里的RegExp.$1、RegExp.$2作用是相同的。
console.log(n_str) //world hello非捕獲性分組:(?:)
非捕獲性分組工作模式下分組(?:)會作為匹配校驗,并出現在匹配結果字符里面,但不作為子匹配返回。比如利用非捕獲性分組獲取字符串000aaa111,而且只返回一個值為aaa111的數組://先看用捕獲性分組匹配會返回什么
var str1 = '000aaa111';
var pattern = /([a-z]+)(\d+)/; //捕獲性分組匹配
var arr = pattern.exec(str1);
console.log(arr) //['aaa111','aaa','111'] 結果子串也獲取到了,這并不是我們想要的結果//非捕獲性分組
var str2 = '000aaa111';
var pattern2 = /(?:[a-z]+)(?:\d+)/; //非捕獲性分組匹配
var arr2 = pattern.exec(str2);
console.log(arr2) //['aaa111'] 結果正確 前瞻:(?=)和(?!)
前瞻分為正向前瞻和反(負)向前瞻,正向前瞻(?=表達式)表示后面要有什么,反向前瞻(?!表達式)表示后面不能有什么。前瞻分組會作為匹配校驗,但不出現在匹配結果字符里面,而且不作為子匹配返回。正向前瞻匹配一批圖片格式:
//正向前瞻,匹配.jpg后綴文件名
var str = '123.jpg,456.gif,abc.jpg';
var partern = /\w+(?=\.jpg)/g; //正向前瞻匹配
console.log(str.match(partern)); //['123', 'abc'] 返回結果正確,沒有匹配456.gif反向前瞻匹配一批字母加數字:
//反向前瞻,匹配3個及以上的a,而且后面不能有000的字符
var str = 'aaa000 aaaa111 aaaaaaa222';
var partern = /a{3,}(?!000)/g; //反向前瞻匹配
console.log(str.match(partern)); //['aaaa', 'aaaaaaa'] 返回結果正確,沒有匹配aaa000前瞻,可以放在位置不固定,可前匹配和后匹配,如:/(?=.jpg)\w+/g;后顧:(?<=)和(?<!) —JavaScript不支持
后顧分為正向后顧和反(負)向后顧,正向后顧(?<=表達式)表示前面要有什么,反向后顧(?<!表達式)表示前面不能有什么。
/正向后顧
(?<=abc) //前面需要有abc//反向后顧
(?<!abc) //前面不能有abc名詞解釋:前瞻 = 先行斷言
(?=) 正向前瞻 = 正向零寬先行斷言
(?!) 反向前瞻 = 負向前瞻 = 負向零寬先行斷言后顧 = 后發斷言
(?<=) 正向后顧 = 正向零寬后發斷言
(?<!) 反向后顧 = 負向后顧 = 負向零寬后發斷言備注,總結
可以通過多個前瞻組合一塊控制,字符串里邊必須包含指定字符。
示例:
(?=.[0-9].)(?=.[A-Z].)(?=.[a-z].).{6,20} 可以匹配包含大寫字母,小寫字母,數字