正则表达式

问答

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

• \d：匹配0-9之间的任意数字，相当于[0-9];

• \w：匹配任意的字母、数字和下划线,相当于[A-Za-z0-9_]

• \s：匹配空格（包括制表符、空格符、断行符等），相当于[^A-Za-z0-9_]

• [a-zA-Z0-9]:匹配任意的字母和数字。

• \b:匹配词的边界

• .：匹配除了回车符和换行符之外的所有字符。

• *：表示出现0次或多次（任意次），等同于{0,}

• +:表示出现1次或多次（至少出现一次），等同于{1,}

• ?：表示出现0次或1次（最多出现一次），等同于{0,1}

• x{3}：x字符出现3次，即匹配连续3个x字符。

• ^:以xxx开头，$以xxx结尾，另外在[^]中，表示取反的意思。

`^`

`$`

`^$`结合使用

取反

2.贪婪模式和非贪婪模式？

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

贪婪模式

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

非贪婪模式

代码题：

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

    function trim(str){
        var re = /^\s+|\s+$/g;
        return str.replace(re,"");
    }

运行结果

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

    var reg = new RegExp('(\\s|^)'+cls+'(\\b|$)','g');

    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,"")
        }
    }    

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

//邮箱由2部分组成，中间用@符号链接，可以使用大小写字母。
//第一部分：由字母、数字、下划线、中线'-'、点'.'组成。
//第二部分：由域名+域名后缀组成，域名包括字母、数字、下划线，域名后缀一般为.xxx或.xxx.xx。
    function isEmail(str){
        var reg = /^[\w\.-]+@\w+(\.\w{2,3})+$/i;
        return reg.test(str);
    }

运行结果

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

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

运行结果

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

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

运行结果

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

    //至少两种的取反是只有一种，排除只有一种的情况即可。
    function isValidPassword(str){
        var reg = /^\w{6,20}$/;
        if(reg.test(str)){
            if(/^[a-z]+$/.test(str)) return false;
            else if(/^[A-Z]+$/.test(str)) return false;
            else if(/^\d+$/.test(str)) return false;
            else if(/^_+$/.test(str)) return false;
            else return true;
        }else return false;
    }

运行情况

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

    var re = /#[a-z0-9]{6}/ig;
    var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "
    console.log(subj.match(re));

运行结果

8.下面代码输出什么？为什么？改写代码，让其输出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);  

运行代码

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

//贪婪模式
    str = '.. <!-- My -- comment /n test --> ..  <!----> .. '
    re = /<!--[^>]*-->/g;
    str.match(re);
//非贪婪模式
    str = '.. <!-- My -- comment /n test --> ..  <!----> .. '
    re = /<!--[\w\W]*?-->/g;//[\w\W]匹配一切字符
    str.match(re);

贪婪模式

非贪婪模式

10.补全下面表达式

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

运行结果

本文版权归本人和饥人谷所有，转载请注明来源。