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>"]