問答
一、\d，\w,\s,[a-zA-Z0-9],\b,.,*,+,?,x{3},^$分別是什么?
\d：查找數字
\w：查找單詞字符（字母、數字、下劃線)
\s：查找空白字符（空格、回車、換行、tab）
[a-zA-Z0-9]：查找方括號之間的任何字符
-
\b：匹配一個單詞邊界（包括 開頭、結尾、空格分割、中橫線分割），不匹配任何字符
eg1：
Paste_Image.png
匹配結果是：成功；匹配到的內容是："@a"；匹配到的位置是：開始于2，結束于4。
進一步說明："/b" 與 "^" 和 "$" 類似，本身不匹配任何字符，但是它要求它在匹配結果中所處位置的左右兩邊，其中一邊是 "/w" 范圍，另一邊是 非"/w" 的范圍。
eg2：
Paste_Image.png
匹配結果是：成功；匹配到的內容是："end"；匹配到的位置是：開始于15，結束于18。 *：匹配任何0次或多次規則相符的字符串
+：匹配任何至少包括一次規則相符的字符串
?：匹配任何0個或一個規則相符的字符串
x{3}：匹配3個x的序列的字符串
^：與字符串開始的地方匹配，不匹配任何字符
$：與字符串結束的地方匹配，不匹配任何字符
二、貪婪模式和非貪婪模式指什么?
- 貪婪模式:量詞在默認下是盡可能多的匹配的，例如：
'123456789'.match(/\d{3,5}/g); //["12345", "6789"]
非貪婪模式:讓正則表達式盡可能少的匹配，一旦成功匹配不再繼續嘗試，在量詞后加上?即可，例如：
'123456789'.match(/\d{3,5}?/g); //["123", "456", "789"]
- 編程中如何區分兩種模式
默認是貪婪模式；在量詞后面直接加上一個問號？就是非貪婪模式。
量詞：{m,n}：m到n個
*：任意多個
+：一個到多個
？：0或一個
參考
代碼題
一、寫一個函數trim(str)，去除字符串兩邊的空白字符
function trim(str){
var reg =/^\s+|\s+$/g;
console.log( str.replace(reg,'' ));
}
二、使用實現 addClass(el, cls)、hasClass(el, cls)、removeClass(el,cls)，使用正則
function hasClass(el, cls) {
var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)')//\\s:需要匹配“\s”本身需要轉義符輔助表達
return reg.test(el.className);
}
function addClass(el,cls){
var str =el.className;
if(!hasClass(el,cls)){
str +=' '+ cls;
}
}
function removeClass(el,cls){
var str =el.className;
if(hasClass(el,cls)){
str= str.replace(cls,'');
return str;
}
else str;
}
三、寫一個函數isEmail(str)，判斷用戶輸入的是不是郵箱
function isEmail(str){
var reg =/\S+[@]{1}(\S)+\.\w+/;
if(reg.test(str)){console.log("有效郵箱")}
else {console.log("無效郵箱")}
}
四、寫一個函數isPhoneNum(str)，判斷用戶輸入的是不是手機號
function isPhoneNum(str){
var reg=/ ^1[358]\d{9}$/;
if (reg.test(str)) {
console.log('有效的手機號碼');
}else{
console.log("無效的手機號碼");
}
}
五、寫一個函數isValidUsername(str)，判斷用戶輸入的是不是合法的用戶名（長度6-20個字符，只能包括字母、數字、下劃線）
function isValidUsername(str){
var reg =/^\w{6,20}$/
if (reg.test(str)) {
console.log("有效用戶名");
}else{
console.log("請輸入正確的用戶名");
}
}
六、寫一個函數isValidPassword(str), 判斷用戶輸入的是不是合法密碼（長度6-20個字符，只包括大寫字母、小寫字母、數字、下劃線，且至少至少包括兩種）
function isValidPassword(str){
var rag1=/^\w+{6,20}$/;
var rag2=/(^[0-9]+$)|(^[a-z]+$)|(^[A-Z]+$)|(^_+$)/;
if(rag1.test(str)==true){
if(rag2.test(str)==true){
alert("格式錯誤");
}
else{
return str;
};
}
else{
alert("格式錯誤");
}
};
七、寫一個正則表達式，得到如下字符串里所有的顏色（#121212）
Paste_Image.png
var re = /[#]{1}[0-9a-fA-F]{6}/g;
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "
console.log( subj.match(re) ) // #121212,#AA00ef
八、下面代碼輸出什么? 為什么? 改寫代碼，讓其輸出hunger, world.
輸出：
Paste_Image.png
原因：因為處于貪婪模式，匹配" "之間的除了換行和回車之外的任意字符
改寫：
//非貪婪模式
var str = 'hello "hunger" , hello "world"';
var pat = /".*?"/g;
str.match(pat); // "hunger","world"
//貪婪模式
var str = 'hello "hunger" , hello "world"';
var pat=/"[^"]+"/g;
str.match(pat);
[""hunger"", ""world""]
九、補全如下正則表達式，輸出字符串中的注釋內容. (可嘗試使用貪婪模式和非貪婪模式兩種方法)
Paste_Image.png
//非貪婪模式：
str = '.. <!-- My -- comment \n test --> .. <!----> .. '
re = /<!--[\W\w]*?-->/g;
str.match(re) // '<!-- My -- comment \n test -->', '<!---->'
//貪婪模式：
str = '.. <!-- My -- comment \n test --> .. <!----> .. '
re = /<!--[^>]*-->/g;
str.match(re) // '<!-- My -- comment \n test -->', '<!---->'
十、補全如下正則表達式
Paste_Image.png
//非貪婪模式：
var re = /<[^>]+?>/g;
var str = '<> <a href="/"> <input type="radio" checked> <b>'
str.match(re) // '<a href="/">', '<input type="radio" checked>', '<b>'
//貪婪模式：
var re = /<[^>]+>/g;
var str = '<> <a href="/"> <input type="radio" checked> <b>'
str.match(re) // '<a href="/">', '<input type="radio" checked>', '<b>'
