問答

• \d，\w,\s,[a-zA-Z0-9],\b,.,*,+,?,x{3},^$分別是什么?
  /d 查找數(shù)字
  \w 查找單詞字符(字母、數(shù)字、下劃線)。
  /s 查找空白字符(空格、tab、換行、回車)。
  [a-zA-Z0-9] 匹配大小寫字母和數(shù)字。
  \b 匹配單詞邊界
  . 匹配除了回車（/r）、換行（\n）、行分隔符（\u2028）和段分隔符（\u2029）以外所有單個(gè)字符。
  * 匹配包含0個(gè)或者多個(gè)的字符串 等同于{0,}
  + 表示某個(gè)出現(xiàn)過1次或多次，等同于{1,}
  ?表示出現(xiàn)過0次或1次，等同于{0,1}
  x{3} 匹配3個(gè)x這樣序列的字符串
  ^字符串的開始
  $字符串的結(jié)束

• 貪婪模式和非貪婪模式指什么?
  貪婪模式：盡可能選擇往多了匹配，即匹配到下一個(gè)字符不滿足為止。* ,+。
  非貪婪模式：一旦條件滿足了，就不繼續(xù)往下匹配。盡可能少的匹配。*?,+?。
  貪婪模式：console.log('123456789'.match(/\d{2,3}/g));//["123","456","789"]
  非貪婪模式：console.log('123456789'.match(/\d{2,3}?/g))//["12","34","56","78"]

代碼題

• 寫一個(gè)函數(shù)trim(str)，去除字符串兩邊的空白字符

        <script type="text/javascript">
        
            function trim(str){
                return str.replace(/^\s*|\s*$/g,'');
            }
        </script>

• 使用實(shí)現(xiàn) addClass(el, cls)、hasClass(el, cls)、removeClass(el,cls)，使用正則

        <script type="text/javascript">
            var p = {
                className: "main layout ads"
            };

            function addClass(el, cls) {
                var rg = new RegExp("\\b" + cls + "\\b", "g");
                if(!rg.test(el.className)) {
                    el.className +=" " + cls;
                }else{
                    return "class has already existing"
                }
            }

            function hasClass(el, cls) {
                var rg = new RegExp("\\b" + cls + "\\b", "g");
                if(rg.test(el.className)) {
                    return true;
                } else {
                    return false;
                }
            }

            function removeClass(el, cls) {
                var rg = new RegExp("\\b" + cls + "\\b", "g");
                if(rg.test(el.className)) {
                    el.className = el.className.replace(rg, "");
                    el.className = el.className.replace(/\s{2}/g, " ");
                }
            }
            
            addClass(p,"ppp");
            console.log(p.className)//main layout ads ppp
            console.log(addClass(p,"main"));//class has already existing
            console.log(hasClass(p,"main"))//true
            console.log(hasClass(p,"s"))//false
            removeClass(p,"layout");
            console.log(p.className);//main ads ppp
            
        </script>

• 寫一個(gè)函數(shù)isEmail(str)，判斷用戶輸入的是不是郵箱

        <script type="text/javascript">
            function isEmail(str){
                var Emeier = /(\w)+[@]{1}(\w)+[.]{1}(\w)+/;
                return Emeier.test(str);
            }
            console.log(isEmail("123wdasdszc@qq.com"));
            console.log(isEmail("123wdasdszcqq.com"));
        </script>

• 寫一個(gè)函數(shù)isPhoneNum(str)，判斷用戶輸入的是不是手機(jī)號(hào)

        <script type="text/javascript">
            function isPhoneNum(str){
                var phNum = /^1[3689]{1}\d{9}$/;
                return phNum.test(str);
            }
            console.log(isPhoneNum("15858020000"));//false
            console.log(isPhoneNum("13999999999"));//true
        </script>

• 寫一個(gè)函數(shù)isValidUsername(str)，判斷用戶輸入的是不是合法的用戶名（長(zhǎng)度6-20個(gè)字符，只能包括字母、數(shù)字、下劃線）

        <script type="text/javascript">
            function isValidUsername(str){
                var userN = /^\w{6,20}$/;
                return userN.test(str);
            }
            console.log(isValidUsername("dwadpp"));//true
            console.log(isValidUsername("dwadpp_"));//ture
            console.log(isValidUsername("dwadpp_1222"));//true
            console.log(isValidUsername("dwadpp_21ew&*"));//false
        </script>

• 寫一個(gè)函數(shù)isValidPassword(str), 判斷用戶輸入的是不是合法密碼（長(zhǎng)度6-20個(gè)字符，包括大寫字母、小寫字母、數(shù)字、下劃線至少兩種）

        <script type="text/javascript">
            function isValidPassword(str) {
                if(/\W/.test(str)) {
                    return false;
                } else {
                    if(/^\w{6,20}$/.test(str)) {
                        if(/(^[0-9]+$)|(^[A-Z]+$)|(^[a-z]+$)|(^[_]+$)/g.test(str)) {
                            return false;
                        } else {
                            return true;
                        }
                    } else {
                        return false;
                    }
                }
            }
            console.log(isValidPassword("_24uihduihs2232"));//true
            console.log(isValidPassword("*(awdawd24314_"));//false
            console.log(isValidPassword("12345678"));//false
        </script>

• 寫一個(gè)正則表達(dá)式，得到如下字符串里所有的顏色（#121212）

        <script type="text/javascript">
            var re = /#[0-9a-fA-F]{6}/g；//這么寫

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

            alert(subj.match(re)) // #121212,#AA00ef
        </script>

• 下面代碼輸出什么? 為什么? 改寫代碼，讓其輸出hunger, world.

        <script type="text/javascript">
            var str = 'hello  "hunger" , hello "world"';
            var pat = /".*?"/g;   //這么寫
            str.match(pat);
        </script>

• 補(bǔ)全如下正則表達(dá)式，輸出字符串中的注釋內(nèi)容. (可嘗試使用貪婪模式和非貪婪模式兩種方法)

        <script type="text/javascript">     
            var str = '.. <!-- My -- comment \n test --> ..  <!----> .. '
            var re1 = /<!--[\W\w]*?-->/g;//首先是貪婪模式的寫法
            var re2 = /<!--[^>]*-->/g;//非貪婪模式寫法
            str.match(re1) // '<!-- My -- comment \n test -->', '<!---->'
            str.match(re2);//["<!-- My -- comment test -->", "<!---->"]
        </script>

• 補(bǔ)全如下正則表達(dá)式

        <script type="text/javascript">
            var re = /<[^>]+>/g;//這么寫
            var str = '<> <a href="/"> <input type="radio" checked> <b>';
            str.match(re); // '<a href="/">', '<input type="radio" checked>', '<b>'
        </script>