任务21-正则表达式

问答

• \d，\w, \s, [a-zA-Z0-9], \b, . , *, +, ?, x{3}, ^$分别是什么?
  答案：
  \d：查找数字。
  \w：查找单词字符(字母，数字，下划线)。
  \s：查找空白字符(空格、tab、换行、回车)。
  [a-zA-Z0-9]：查找任何从小写 a 到大写 Z 及任何0到9的字符数字。
  \b：匹配单词边界。
  .：查找单个字符，除了换行和行结束符。
  *：匹配0个或多个。
  +：匹配1个或多个。
  ?：匹配0个或1个。
  x{3}： 匹配包含 3个 x 的序列的字符串
  ^$:匹配开头结尾，比如^n$匹配任何开头为n结尾为n的字符串
• 贪婪模式和非贪婪模式指什么?
• 贪婪模式：正则引擎尽可能多地重复匹配字符。
• 非贪婪模式：正则引擎尝试用 最小可能的重复次数来进行匹配，尽可能少地匹配字符。

代码题

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

   
  function trim(str){
   newstr=str.replace(/^\s+|\s+$/g,'')
   return newstr;
   }
   trim(' hahahaga233 ');
   console.log(trim(' hahahaga233 '));
   

  
  方法2：
  

  
   function trim(str){
   newstr=str.split(/\s+/).join('');
   return newstr;
   }
   trim(' hah a ha ga 233');
   console.log(trim(' hah a ha ga 233 '));
   

• 使用实现 addClass(el, cls)、hasClass(el, cls)、removeClass(el,cls)，使用正则ps： 视频里问题纠正

//提示: el为dom元素，cls为操作的class， el.className获取el元素class
function addClass(el, cls){
   if(!hasClass(el,cls)){
  return el.className+=(""+cls);
   }
}

// 参考老师的写法，有点不理解：
 function hasClass(el, cls) {
 var reg = new RegExp('(\s|^)'+cls+'(\s|$)');
 return reg.test(el.className);
 }
function removeClass(el, cls) {
var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
  tmp = node.className.replace(reg, '').replace(/\s{2,}/g, ' '); //把两个以上的空格替换为一个空格
el.className = trim(tmp);

}

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

  
   function isEmail(str){
   var patt=/\S+@+\S+|.\S+/;
   return patt.test(str);
   
  }
   isEmail('[email protected]');
   console.log(isEmail('[email protected]'));
   

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

  
   function isPhoneNum(str){
   var patt=/^1[356789]\d{9}$/;
   return patt.test(str);
   }
   isPhoneNum('18265550125');
   console.log(isPhoneNum('18265550125'));
   

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

  
   function isValidUsername(str){
   var patt=/^\w{6,20}$/;
   return patt.test(str);
   }
   isValidUsername('22aa_hahahAAAHH');
   console.log(isValidUsername('22aa_hahahAAAHH'));
   

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

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

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

 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
 

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

输出结果及原因：

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

//    /".\*"/g; 匹配的内容为"任意个任意字符"，因为*默认为贪婪模式，所以会尽可能多地匹配符合正则的内容，输出结果为：[""hunger" , hello "world""]

改写方案1：

 var str = 'hello "hunger" , hello "world"';
 var pat = /".*?"/g; //?改为非贪婪模式
 str.match(pat);
 

改写方案2：

 var str = 'hello "hunger" , hello "world"';
 var pat=/"[^"]+"/g;
 str.match(pat);

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

  
  
  
  
  

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

• 补全如下正则表达式

 //贪婪模式：
 var re = /<[^>]+>/;
 var str = '<>   ';
 str.match(re);
 // '', '', '';
 //非贪婪模式：
 var re = /<[^>]+?>/g;
 var str = '<>   ';
 str.match(re);
 

.