作用
用于檢索替換那些符合某個模式的文本。
創建
- var reg=new RegExp('<%[^%]>','g')
- var reg=/%[^%]/g;
語法
g: 全文檢索,不添加的話,搜索到第一個結果就停止檢索。
i: 忽略大小寫
m:多行檢索
元字符
\t: 制表符
\r: 回車
\n: 換行
\f: 換頁符
[]: 可以使用此來構建一個簡單的類,例如[abc]只匹配一個字符。一般情況下,正則表達式的一個字符(轉義符算一個)對應字符串的一個字符。
取反
[^abc]
范圍類
[0-7]
預定義類
. : 除了回車和換行符之外的所有字符
\d : 數字[0-9]
\D : 非數字 [^0-9]
\s :空白符
\S :非空白符
\w :字母、數字、下劃線
\W :非字母、數字、下劃線
邊界
^: 以。。。開頭,/^abc/以abc開頭
$: 以。。。結尾
\B: 非單詞邊界
\b: 單詞邊界(單詞邊上有空格、下劃線才能匹配)
var reg=/^h\dm/g
'h3m h4m h2m'.match(reg)//'h3m'雖然是全局,但是結果仍然是h3m,因為以h3m開頭。
匹配手機號
'13513219627'.match(/^\d{10}$/)
匹配字符串(單詞邊界)
' hello worhellold hello'.match(/\bhello\b/g)//['hello','hello']
' hello wor_hello_ld hello'.match(/\bhello\b/g)//['hello','hello','hello']
量詞(匹配幾次)
?: 出現0次或1次
+:出現1次或多次
*:任意次
{n}: 出現n次
{n,m}: 出現n到m次
{n,}:至少出現n次
{,m}:最多出現m次
'a12345b678cde'.match(/[a-z]\d?/g)//['a','b','c','d','e']
'a12345b678cde'.match(/[a-z]\d*/g)//['a12345','b678','c','d','e']
'a12345b678cde'.match(/a-z\d+/g)//['a12345','b678']
'a12345b678cde'.match(/[a-z]\d{a,4}/g)//['a1234','b678'],1到4個即1,2,3,4都行
貪婪模式與非貪婪模式
默認是貪婪模式,即能夠盡可能多的匹配,如果匹配不上,再往下減。
'123456789'.match(/\d{3,5}/g);//['12345','6789']
非貪婪模式
讓正則表達式盡可能少的匹配,也就是一旦匹配成功就不再繼續匹配。做法就是在量詞后加?
'123456789'.match(/d{3,5}?/g)//['123','456','789']
'a12345b678cde'.match(/[a-z]\d??/g)//['a','b','c','d','e']
'a12345b678cde'.match(/[a-z]\d+?/g)//['a1','bb']
'a12345b678cde'.match(/[a-z]\d*?/)//['a','b','c','d','e']
分組
byron{20}//n重復20次
(byron){20}//byron重復20次
'hello hello'.match(/(hello){2,3}/g)//['hello hello']
(byron|casper){20}
(byron).(ok)
前瞻
exp1(?=exp2)//exp1的后面必須是exp2,返回exp1
exp1(?!exp2)//exp1的后面不是exp2
例如:
(/good(?=byron)/).exec('goodbyron123')//['good']
(/good(?=byron)/).exec('goodcasper123')//null
var str='ruoyu444hello\nruoyu123\nruoyu789'
console.log(str.match(/^ruoyu\d(3)/g))//ruoyu
console.log(str.match(/^ruoyu\d(3)/mg))//多行匹配可以匹配所有''ruoyu'開頭的字符串。
方法
test(str)
var reg=/hello/
reg.test('hello world')//true
exec(str)
把匹配的項以數組的形式打印出來
string.search(reg)
不執行全局匹配,忽略標志g。并且總是從字符串的開始進行檢索,返回子串的起始位置。
var str='visit runoob';
var n=str.search(/runoob/i)
console.log(n)//6
string.replace(reg,replace)
檢測到字符串以找到一個或多個與regexp匹配的文本,是否有g對結果影響很大。
var str='hello jirengu hbllo world'
var reg=/h[a-z]llo/g
str=str.replace(reg,'hello')
console.log(str)
string.replace(reg,function)
在前面的介紹中只能把所有的匹配替換為固定的內容,但是如果想要把匹配的字符做一些事情怎么辦?
var str2='hallo jirengu hbllo world'
var reg=/h[a-z]llo/g
str2=str2.replace(reg,function(value){
return value[0].toUpperCase()+value.substr(1)
})//value指的是匹配好的字符
'2389ru9w45hg'.replace(/\d+/g,function(r){
return ('+r+')
})//(2389)ru(9)w(45)hg
string.split()
用split方法把字符串分割成字符串數組。
'a,b,c,d'.split(',')//['a','b','c','d']
'a1b2c3d'.split(/\d/)//['a','b','c','d']
var reg=/\w+@.+/
/#[0-9 a-f A-F]{6}|[0-9 a-f A-F]{3}(?=;)/g//遇到?=;的意思是說目標串中肯定存在‘;’
### 應用
1. ###寫一個函數isEmail(str),判斷用戶輸入的是不是郵箱
function isEmail(str){
var str1=/^\w+@[a-zA-z0-9]+(.[a-zA-z]+)+/
return str1.test(str)
}
isEmail(str)
console.log(isEmail('1610194370@qq.com'))
2. ###寫一個函數isPhoneNum(str),判斷用戶輸入的是不是手機號
function isPhoneNum(str){
var str1=/1\d{10}$/g
return str1.test(str)
}
var str2=isPhoneNum(13513219658)
console.log(str2)
3. ###寫一個函數isValidUsername(str),判斷用戶輸入的是不是合法的用戶名(長度6-20個字符,只能包括字母、數字、下劃線)
function isValidUsername(str){
var str1=/^\w{6-20}$/g
return str1.test(str)
}
var str2=isValidUsername('1254lkj')
console.log(str2)
4. ###寫一個函數isValidPassword(str), 判斷用戶輸入的是不是合法密碼(長度6-20個字符,只包括大寫字母、小寫字母、數字、下劃線,且至少包括兩種)
function isValidPassword(str){
if(!/\w{6-20}/g.test(str))return false;
if(/^[A-Z]{6-20}$/g.test(str))return false;
if(/^[a-z]{6-20}$/g.test(str))return false;
if(/^[0-9]{6-20}$/g.test(str))return false;
if(/^_{6-20}$/g.test(str))return false;
}
var str1=isValidPassword('1234688885');
console.log(str1)
5. ###寫一個正則表達式,得到如下字符串里所有的顏色
var re=/#[0-9a-fA-F]{6}|[0-9a-fA-F]{3};/g
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee "
console.log( subj.match(re) )
6. ###下面代碼輸出什么? 為什么? 改寫代碼,讓其輸出[""hunger"", ""world""].
var str = 'hello "hunger" , hello "world"';
var pat = /"."/g;
str.match(pat);//輸出:[""hunger" , hello "world""].代表匹配除了回車和換行符之外的所有字符,又因為是貪婪模式所以會匹配3個。
讓其輸出[""hunger"", ""world""]只需改為非貪婪模式/".?"/