1.\d，\w,\s,[a-zA-Z0-9],\b,.,*,+,?,x{3},^$分別是什么?
\d 匹配0-9之間的任意一位數字，相當于[0-9]
"23456abc12".match(/\d/g)
["2", "3", "4", "5", "6", "1", "2"]
"23456abc12".match(/\d\d/g)
["23", "45", "12"]
\w 匹配字母數字下劃線字符，相當于[a-zA-Z0-9_]
**"2A_kc$*)".match(/\w/g)**
**["2", "A", "_", "k", "c"]**
\s匹配空格
"2A K D S".match(/\s/g)
[" ", " ", " ", " "]
[a-zA-Z0-9]
連字符，匹配設定范圍中的任意一位，不要過度使用連字符，最典型的例子就是[A-z]，表面上它是選中從大寫的A到小寫的z之間52個字母，但是由于在ASCII編碼之中，大寫字母與小寫字母之間還有其他字符，反斜杠（\）的ASCII碼在大寫字母與小寫字母之間。**/[A-z]/.test('\\') // true**
\b匹配單詞邊界
/\bm/代表m是否為開始，/om\b/代表om是否為結尾，/\bhello\b/代表匹配獨立單詞hello。開頭、結尾、空格分割、中橫線分割都可視為邊界
"start-start start start".match(/\bstart/g)
//["start", "start", "start", "start"]
"start-start start start".match(/start\b/g)
//["start", "start", "start", "start"]
"start-start start startccccc".match(/\bstart\b/g) //這里兩邊設定邊界表示匹配獨立單詞start
//["start", "start", "start"]
.匹配一位任意字符（除回車、換行、分隔符以外）
"a c\n *12AB".match(/./g)
["a", " ", "c", " ", "*", "1", "2", "A", "B"] //\n換行、空格不匹配返回null
? 問號表示某個模式出現0次或1次，等同于{0, 1}。
*** 星號表示某個模式出現0次或多次，等同于{0,}。**
+ 加號表示某個模式出現1次或多次，等同于{1,}。
var s="ababbabbbcccaabbbaaaabcbaaa"
s.match(/ab+/g) //匹配以a開頭b出現1次或多次的字符，b如果出現多次盡量多匹配
["ab", "abb", "abbb", "abbb", "ab"]
s.match(/ab*/g) //匹配以a開頭b出現0次或多次的字符，b如果出現多次盡量多匹配
["ab","abb","abbb","a","abbb","a","a","a","ab","a","a","a"]
s.match(/ab?/g) //匹配以a開頭b出現0次或1次的字符
["ab","ab","ab","a","ab","a","a","a","ab","a","a","a"]
x{3}匹配x出現3次的字符
"cccxxxyyexxxx".match(/x{3}/g) //匹配x連續出現3次
["xxx", "xxx"]
"cccxxxyyexxxx".match(/x{3,}/g) //匹配x連續出現3次及以上
["xxx", "xxxx"]
"cccxxxyyexxxx".match(/x{3,4}/g) //匹配x連續出現最少3次，最多4次
["xxx", "xxxx"]
^k匹配k開始的字符，k$匹配k結尾的字符，$放后面
"kekilly".match(/^k/g)
["k"]
"kekilly".match(/^y/g)
null
"kekilly".match(/y$/g)
2.貪婪模式和非貪婪模式指什么?
貪婪模式：最大可能匹配，即匹配直到下一個字符不滿足匹配規則為止。
var s="ababbabbbcccaabbbaaaabcbaaa"
s.match(/a+/g) //a出現一次或多次，最大限度匹配a
["a", "a", "a", "aa", "aaaa", "aaa"]
s.match(/a*/g) //a出現0次或多次，最大限度匹配a
["a", "", "a", "", "", "a", "", "", "", "", "", "", "aa", "", "", "", "aaaa", "", "", "", "aaa", ""]
非貪婪模式：與貪婪模式相反，讓正則表達式盡可能少的匹配，也就是一旦匹配成功就不再嘗試匹配。量詞后加?是非貪婪模式
s.match(/a*?/g) //a*出現0次或多次，盡可能少匹配就是a出現0次
["", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""]
s.match(/a+?/g) //a出現1次或多次,盡可能少匹配就是a出現1次
["a", "a", "a", "a", "a", "a", "a", "a", "a", "a", "a", "a"]
3.寫一個函數trim(str)，去除字符串兩邊的空白字符
(function trim(str){
return str.match(/\S+/g)
}(" safasd asdf ad"))
//輸出結果：["safasd", "asdf", "ad"]
4.使用實現 addClass(el, cls)、hasClass(el, cls)、removeClass(el,cls)，使用正則
var reg = new RegExp('(\\s|^)'+cls+'(\\b|$)','g');\\等同于/\bcls\b|\s+cls+\s/g即匹配cls兩邊有空格的情況和匹配cls為唯一單詞的情況。也就是匹配cls是不是class=的類名稱
function addClass(el,cls){
if(reg.test(el.className)){
return el.className += " " + cls;
}
}
function hasClass(el,cls){
return reg.test(el.className);
}
function removeClass(el,cls){
if(reg.test(el.className)){
return el.className.replace(reg,"")
}
}
5.寫一個函數isEmail(str)，判斷用戶輸入的是不是郵箱
function isEmail(str){
var reg=/\w+@\w+\.\w{2,}/ig; //.后面的域名至少為2位
return reg.test(str)
};
isEmail("Abc_sdfg@regl.com.cn.net")//返回true
isEmail("123@1.c")//返回false
6.寫一個函數isPhoneNum(str)，判斷用戶輸入的是不是手機號
function isPhoneNum(num){
var reg2=/1[3456789]\d{9}$/g //第一位1，第二位3456789，第3位為任意數字且出現9次后結束
return reg2.test(num)
};
isPhoneNum(18600000001) //返回ture
7.寫一個函數isValidUsername(str)，判斷用戶輸入的是不是合法的用戶名（長度6-20個字符，只能包括字母、數字、下劃線）
function isValidUsername(str){
var reg=/^\w{6,20}$/g
return reg.test(str)
};
isValidUsername("2cccccllllllll2llll_") //返回ture
isValidUsername("2ccc") //返回false
8.寫一個函數isValidPassword(str), 判斷用戶輸入的是不是合法密碼（長度6-20個字符，包括大寫字母、小寫字母、數字、下劃線中至少兩種類型）
function isValidPassword(str){
var reg=/^\w{6,20}$/g; //先驗證是否為字母數字下劃線且為6-20位
if(reg.test(str)==true){ //至少兩種即只包含一種情況時返回false,直到排除所有僅包含一種的情況
if(/^[a-z]{6,20}$/.test(str)==true){
return false;
}
else if(/^[A-Z]{6,20}$/.test(str)){
return false;
}
else if(/^\d{6,20}$/.test(str)){
return false;
}
else if(/^_{6,20}$/.test(str))
return false;
else return true;
}
else return false;
}
9.寫一個正則表達式，得到如下字符串里所有的顏色（#121212）
var re = /*正則...*/
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "
alert( subj.match(re) ) // #121212,#AA00ef
代碼如下：
var re=/#\w{6}/gi
subj.match(/#\w{6}/gi)
//輸出結果為：["#121212", "#AA00ef"]
10.下面代碼輸出什么? 為什么? 改寫代碼，讓其輸出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;//非貪婪模式,?代表.出現0次或多次取0次
str.match(pat); //返回[""hunger"", ""world""]
11.補全如下正則表達式，輸出字符串中的注釋內容. (可嘗試使用貪婪模式和非貪婪模式兩種方法)
str = '.. <!-- My -- comment \n test --> .. <!----> .. '
re = /.. your regexp ../
str.match(re) // '<!-- My -- comment \n test -->', '<!---->'
代碼如下：
非貪婪模式:
re =/<!--[^]*?-->/g //<!--開始,-->結尾,中間[^]代表任意字符(包括空格回車換行)，其出現0次或多次取0次
str.match(/<!--[^]*?-->/g)
/*返回結果["<!-- My -- comment
test -->", "<!---->"]*/
貪婪模式:
re=/<!--[^>]*-->/g //匹配<!--開始,-->結尾，中間[^>]即中間只要不是>的字符串出現0次或多次
str.match(/<!--[^>]*-->/g)
/*返回結果["<!-- My -- comment
test -->", "<!---->"]*/
12.補全如下正則表達式
var re = /* your regexp */
var str = '<> <a href="/"> <input type="radio" checked> <b>'
str.match(re) // '<a href="/">', '<input type="radio" checked>', '<b>'
代碼如下：
var re=/<[^<^>]+>/g //<開頭，>結尾，且中間不是<>的字符必須出現一次(排除第一個<>)
str.match(/<[^<^>]+>/g)
//輸出結果["<a href="/">", "<input type="radio" checked>", "<b>"]
