---

keywords: 正则表达式。

---

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

\d：查找数字

\w：查找单词字符（字母、数字、下划线即（a-zA-Z0-9_））

\s：查找空白字符（空格、回车、换行、tab即（ \r\n\f\t\v））

[a-zA-Z0-9]：查找a-z、A-Z、0-9中的任意一个字符

\b：匹配单词边界，一侧为单词字符(\w)，另一侧为非单词字符、字符串的开始(^)或结束位置($)

.：查找单个字符，除了换行和行结束符（\n）,如果要匹配包括“\n”在内的所有字符，一般用[\s\S]或者[^]。

+：匹配+前面的字符一次或多次

*****：匹配*前面的字符零次以上

?：匹配?前面的字符零次或一次

x{3}：匹配连续三个x

^n：脱字符号，用来把n锚定在这一行的开头。

[^abc]：查找任何不再方括号中的字符

n$：美元符号，用来把n锚定在这一行的结尾。

参考：
\b 单词边界
正则表达式参考

• 贪婪模式和非贪婪模式指什么?

？ * + {min，max} 默认是贪婪的，即在符合正则表达式的前提下，尽可能多的匹配字符串。
相应的，非贪婪模式指尽可能少的匹配字符串。
比如：

“This is a <EM>first</EM> test”
如果用\<.+>\去匹配，预期得到<EM>，但事实上得到的是<EM>first</EM>
这就是贪婪模式

上述例子中使用非贪婪模式有两种办法：
1、\<.+?>\ （量词后面接？可以使量词进入非贪婪模式，匹配尽可能少的内容）
2、\<[^<]+>\
参考：
深入浅出之正则表达式

代码题

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

function trim(str) {
    return str.replace(/^\s+|\s+$/g,'')
}

• 使用正则实现 addClass(el, cls)、hasClass(el, cls)、removeClass(el,cls)

function addClass(el , cls) {
    if (! hasClass(el , cls)) {
        el.className += ' ' + cls
    }
    
}


function hasClass(el , cls) {
    var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)' , 'g')
    return reg.test(el.className)
}


function removeClass(el , cls) {
    if (hasClass(el , cls)) {
        var reg = new RegExp('(\\s|^)' + cls + '(\\b|$)' , 'g')  
        el.className = el.className.replace(reg , '')
    }
}

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

function isEmail(str) {
    var reg = /^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/
    return reg.test(str)
}

邮箱验证图解
参考：
JS正则表达式结构图解

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

function isPhoneNum(str) {
    var reg = /^((\+86)|(86))?1[3-9]\d{9}$/
    return reg.test(str)
}

手机号验证图解

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

function isValidUsername(str) {
    var reg = /^[a-zA-Z]\w{5,19}$/
    return reg.test(str)
}

用户名验证图解

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

function isValidPassword(str) {
    var reg = /^\w{6,20}$/
    if (reg.test(str)) {
        if (str.match(/^[A-Z]+$/)) return false
        else if (str.match(/^[a-z]+$/)) return false
        else if (str.match(/^[0-9]+$/)) return false
        else if (str.match(/^_+$/)) return false
        else return true
    } else return false
}

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

var re =/(#[0-9A-F]{6}\b)|(#[0-9A-F]{3})\b/ig

var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "

subj.match(re)  // #121212,#AA00ef #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);  

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

================非贪婪模式========================

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 -->', '<!---->'

• 补全如下正则表达式

var re = /<[^>]+>/g

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