問答
\d偎痛，\w,\s,[a-zA-Z0-9],\b,.,*,+,?,x{3},^$分別是什么?
| 可能的值 | 代表 |
|---|---|
\d |
代表數(shù)字字符 |
\w |
代表單詞字符，字母遍膜，數(shù)字站刑，下劃線 |
\s |
代表空白符 |
[a-zA-Z0-9] |
代表字母际跪，數(shù)字 |
\b |
代表單詞邊界 |
. |
代表任意字符 |
* |
代表匹配0次或多次 |
+ |
代表匹配1次或多次 |
? |
代表匹配零次或1次 |
x{3} |
匹配x三次 |
^ |
代表開頭 |
$ |
代表結(jié)束 |
貪婪模式和非貪婪模式指什么?
在涉及到量詞時怜姿，貪婪模式會將符合正則這一位的所有字符都匹配到，然后再從后往前進行查詢正則的下一位砌创。
在非貪婪模式下虏缸，每有一個符合正則的字符串的值，下一位先判斷是否符合正則的下一位嫩实，否則再判斷是否符合當(dāng)前的正則位刽辙。
在有量詞{3，10}時甲献，假設(shè)符合條件的可以有10次宰缤，處于貪婪模式，會把這符合條件的10次都匹配到；而處于非貪婪模式下撵溃，只要匹配到3次疚鲤，這次匹配就結(jié)束锥累，后面的字符重新開始匹配缘挑。
匹配默認采用的是貪婪模式，想要設(shè)置為非貪婪桶略，要再量詞后面加?即可.
'123456789'.match(/\d{3,5}/g); //["12345", "6789"]
'123456789'.match(/\d{3,5}?/g); //["123", "456", "789"]
代碼題
寫一個函數(shù)trim(str)语淘，去除字符串兩邊的空白字符
function trim(str){
return str.match(/[\S]+(\s+\S+)*/g)[0];
}
trim(' asdfas df asdfa ')\\"asdfas df asdfa"
使用實現(xiàn) addClass(el, cls)、hasClass(el, cls)际歼、removeClass(el,cls)惶翻，使用正則
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<style>
.box1{
background:#eee;
}
.container{
width:900px;
margin:0 auto;
}
</style>
</head>
<body>
<div id="box" class="box1 container">
<span>lahhahah</span>
</div>
<script>
function hasClass(el, cls){
var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)', 'g' );
return reg.test(el.className);
}
function addClass(el, cls){
if(!hasClass(el, cls)){
el.className = el.className + ' ' + cls;
}
return el.className;
}
function removeClass(el, cls){
if(hasClass(el, cls)){
var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
el.className = el.className.replace(reg, '');
}
return el.className;
}
</script>
</body>
</html>
寫一個函數(shù)isEmail(str)，判斷用戶輸入的是不是郵箱
function isEmail(str){
return str.match(/^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/);
}
判斷郵箱正則
寫一個函數(shù)isPhoneNum(str)鹅心，判斷用戶輸入的是不是手機號
function isPhoneNum(str){
return str.match(/^((\+86)|(86))?1[3-9]\d{9}$/);
}
正則判斷手機號
寫一個函數(shù)isValidUsername(str)吕粗，判斷用戶輸入的是不是合法的用戶名（長度6-20個字符，只能包括字母旭愧、數(shù)字颅筋、下劃線）
function isValidUsername(str){
return str.match(/^[a-zA-Z]\w{5,19}$/);
}
合法用戶名
寫一個函數(shù)isValidPassword(str), 判斷用戶輸入的是不是合法密碼（長度6-20個字符，包括大寫字母输枯、小寫字母议泵、數(shù)字、下劃線至少兩種）
function isValidPassword(str){
if (str.match(/^\w{6,20}$/)){
if(str.match(/^[A-Z]*$/)) return false;
if(str.match(/^[a-z]*$/)) return false;
if(str.match(/^[0-9]*$/)) return false;
if(str.match(/^[_]*$/)) return false;
return str;
} else return false;
}
寫一個正則表達式桃熄，得到如下字符串里所有的顏色
var re = /(#[a-fA-F0-9]{6})|(#[a-fA-F0-9]{3})/g;
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2";
subj.match(re);// ["#121212", "#AA00ef", "#fdd", "#fd2"]
下面代碼輸出什么? 為什么? 改寫代碼先口，讓其輸出hunger, world.
var str = 'hello "hunger" , hello "world"';
var pat = /".*"/g;
str.match(pat); //"hunger" , hello "world"
- 因為貪婪模式的影響，所有屬于‘.’的字符都會被匹配到瞳收，然后往回匹配
‘ " ’
貪婪模式
var str = 'hello "hunger" , hello "world"';
var pat = /".*?"/g;
str.match(pat); //"hunger", "world"
- 在非貪婪模式下碉京，從左向右匹配‘
"’，當(dāng)碰到自左方向符合.,且當(dāng)前為"的時候螟深，就取出該字符串谐宙。
非貪婪模式
補全如下正則表達式，輸出字符串中的注釋內(nèi)容. (可嘗試使用貪婪模式和非貪婪模式兩種方法)
str = '.. <!-- My -- comment \n test --> .. <!----> .. ';
re = /<!--[^]*?-->/g;//非貪婪
str.match(re); // '<!-- My -- comment \n test -->', '<!---->'
str = '.. <!-- My -- comment \n test --> .. <!----> .. ';
re = /<!--[^>]*-->/g;//貪婪
str.match(re); // '<!-- My -- comment \n test -->', '<!---->'
貪婪模式運行
- 貪婪模式匹配到一個
>即會停下血崭，回溯匹配卧惜，第一個-沒成功，下一個-成功匹配了-->夹纫，匹配結(jié)束咽瓷，取出字符串。
補全如下正則表達式
var re1 = /<[^>]+>/g;
var re2 = /<[\s\w'"=\/]+?>/g;
var str = '<> <a href="/"> <input type="radio" checked> <b>';
str.match(re2); // '<a href="/">', '<input type="radio" checked>', '<b>'
本教程版權(quán)歸 張宇 及 饑人谷 所有舰讹，轉(zhuǎn)載請注明出處~
