问答

1. \d，\w,\s,[a-zA-Z0-9],\b,.,*,+,?,x{3},^$分别是什么?

• \d：匹配一个数字字符。等价于[0~9]。
• \w：匹配包括下划线的任何单词字符。等价于'[A-Za-z0-9_]'。
• \s：匹配任何空白字符，包括空格、制表符、换页符等等。等价于[\f\n\r\t\v]。
• [a-zA-Z0-9]：匹配小写字母a-z，大写字母A-Z，数字0-9。
• \b：匹配一个单词边界，也就是指单词和空格间的位置。例如，'er\b'可以匹配''never''中的‘er’,但不能匹配“verb”中的'er'。
• .：匹配除“\n”之外的任何单个字符。要匹配包括'\n'在内的任何字符，请使用像'[.\n]'的模式。
• *：匹配前面的子表达式零次或多次。例如，zo*能匹配“z”以及“zoo”。*等价于{0,}。
• +：匹配前面的子表达式一次或多次。例如，'zo+' 能匹配 "zo" 以及 "zoo"，但不能匹配 "z"。+ 等价于 {1,}。
• ?：匹配前面的子表达式零次或一次。例如，"do(es)?" 可以匹配 "do" 或 "does" 中的"do" 。? 等价于 {0,1}。
• x{3}：匹配包含3 个 x 的序列的字符串。
• ^：匹配输入字符串的开始位置。
• $：匹配输入字符串的结束位置。

2. 贪婪模式和非贪婪模式指什么?

• 贪婪模式：量词符，默认情况下都是最大可能匹配，即匹配直到下一个字符不满足匹配规则为止，这就是贪婪模式。

• 非贪婪模式：与贪婪模式相反，让正则表达式尽可能少的匹配，也就是一旦匹配成功就不再尝试匹配，这就是非贪婪模式，使用非贪婪模式很简单，在量词后面加上“？”即可。

代码题

1. 写一个函数trim(str)，去除字符串两边的空白字符

<pre>function trim(str){ var patt1 = /^\s+|\s+$/g; return str.replace(patt1,''); }</pre>

输出结果：

2. 使用实现 addClass(el, cls)、hasClass(el, cls)、removeClass(el,cls)，使用正则

代码：
<pre>
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)){
return el.className += ' '+cls;
}
}
function removeClass(el,cls){
var reg = new RegExp('(^|\\s)'+cls+'($|\\s)','g');
if(hasClass(el,cls)){
return el.className.replace(reg,'');
}
}
var test = {
className: "hello my world"
};
console.log(hasClass(test,"my"));
console.log(addClass(test,"hi"));
console.log(removeClass(test,"hello"));
</pre>

输出结果：

3. 写一个函数isEmail(str)，判断用户输入的是不是邮箱

代码：
<pre>
function isEmail(str){
var reg = /^[\w.-]+@{1}[\w-]+.[\w.-]+$/;
return reg.test(str);
}
</pre>

输出结果：

4. 写一个函数isPhoneNum(str)，判断用户输入的是不是手机号

<pre>
function isPhoneNumber(str){
var reg =/^1[34578]\d{9}$/;
return reg.test(str);
}
</pre>

输出结果：

5. 写一个函数isValidUsername(str)，判断用户输入的是不是合法的用户名（长度6-20个字符，只能包括字母、数字、下划线）

<pre>
function isValidUsername(str){
var reg = /^\w{6,20}$/
return reg.test(str)
}
</pre>

输出结果：

6. 写一个函数isValidPassword(str), 判断用户输入的是不是合法密码（长度6-20个字符，只包括大写字母、小写字母、数字、下划线，且至少至少包括两种）

<pre>
function isValidPassword(str) {
if(/(^\d{6,20}$)|([A-Z]{6,20}$)|(^{[a-z]{6,20})|(}{6,20}$)|(^[a-zA-Z0-9]{0,5}$)/.test(str)) {
alert("Oh,你输入的密码不合法!");
return;
}
if(/^\w{6,20}$/.test(str)){
return true;
}
}

</pre>

输出结果：

7. 写一个正则表达式，得到如下字符串里所有的颜色（#121212）

<pre>
var re = /正则.../
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "
alert( subj.match(re) ) // #121212,#AA00ef
</pre>

代码：
<pre>
var re = /#[0-9A-Za-z]{6}/g
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "
alert( subj.match(re) ) // #121212,#AA00ef
</pre>

输出结果：

8. 下面代码输出什么? 为什么? 改写代码，让其输出hunger, world

<pre>
var str = 'hello "hunger" , hello "world"';
var pat = /".*"/g;
str.match(pat);
</pre>

输出结果：[" "hunger" , hello "world" "]
原因：正则默认采取贪婪模式，所以将hunger跟world之间的hello也匹配上了。
修改后的代码：
<pre>
var str = 'hello "hunger" , hello "world"';
var pat = /".*?"/g;
str.match(pat);
</pre>

输出结果：

9. 补全如下正则表达式，输出字符串中的注释内容. (可尝试使用贪婪模式和非贪婪模式两种方法)

<pre>str = '.. .. .. ' re = /.. your regexp ../ str.match(re) // '', ''</pre>

代码：
贪婪模式：
<pre>str = '.. .. .. ' re = //g; str.match(re);</pre>
输出结果：

非贪婪模式：
<pre>str = '.. .. .. ' re = //g; str.match(re);</pre>

输出结果：

10. 补全如下正则表达式

<pre>`
var re = /* your regexp */

var str = '<> <a href="/"> <input type="radio" checked> <b>'
str.match(re) // '<a href="/">', '<input type="radio" checked>', '<b>'
`</pre>
代码：
<pre>
var re = /<[^>]+>/g;

var str = '<> <a href="/"> <input type="radio" checked> <b>'
str.match(re);
</pre>

输出结果：

本教程版权归饥人谷和作者所有，转载须说明来源。