任务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:
    <pre>

    function trim(str){
    newstr=str.replace(/^\s+|\s+$/g,'')
    return newstr;
    }
    trim(' hahahaga233 ');
    console.log(trim(' hahahaga233 '));
    </pre>
    方法2:
    <pre>
    function trim(str){
    newstr=str.split(/\s+/).join('');
    return newstr;
    }
    trim(' hah a ha ga 233');
    console.log(trim(' hah a ha ga 233 '));
    </pre>

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


<pre>

//提示: 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);

}

</pre>

  • 写一个函数isEmail(str),判断用户输入的是不是邮箱
    <pre>
    function isEmail(str){
    var patt=/\S+@+\S+|.\S+/;
    return patt.test(str);

    }
    isEmail('haha@qq.com');
    console.log(isEmail('hah-a@qq.com'));
    </pre>

  • 写一个函数isPhoneNum(str),判断用户输入的是不是手机号
    <pre>
    function isPhoneNum(str){
    var patt=/^1[356789]\d{9}$/;
    return patt.test(str);
    }
    isPhoneNum('18265550125');
    console.log(isPhoneNum('18265550125'));
    </pre>

  • 写一个函数isValidUsername(str),判断用户输入的是不是合法的用户名(长度6-20个字符,只能包括字母、数字、下划线)
    <pre>
    function isValidUsername(str){
    var patt=/^\w{6,20}$/;
    return patt.test(str);
    }
    isValidUsername('22aa_hahahAAAHH');
    console.log(isValidUsername('22aa_hahahAAAHH'));
    </pre>

  • 写一个函数isValidPassword(str), 判断用户输入的是不是合法密码(长度6-20个字符,包括大写字母、小写字母、数字、下划线至少两种)
    <pre>
    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;
      }
    

    }
    </pre>

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


<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>

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

输出结果及原因:
<pre>
var str = 'hello "hunger" , hello "world"';
var pat = /".*"/g;
str.match(pat);

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

</pre>

</pre>
改写方案1:
<pre>
var str = 'hello "hunger" , hello "world"';
var pat = /".*?"/g; //?改为非贪婪模式
str.match(pat);
</pre>

改写方案2:
<pre>
var str = 'hello "hunger" , hello "world"';
var pat=/"[^"]+"/g;
str.match(pat);

</pre>

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



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

  • 补全如下正则表达式

<pre>
//贪婪模式:
var re = /<[^>]+>/;
var str = '<> <a href="/"> <input type="radio" checked> <b>';
str.match(re);
// '<a href="/">', '<input type="radio" checked>', '<b>';
//非贪婪模式:
var re = /<[^>]+?>/g;
var str = '<> <a href="/"> <input type="radio" checked> <b>';
str.match(re);
</pre>

.

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 220,137评论 6 511
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,824评论 3 396
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 166,465评论 0 357
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 59,131评论 1 295
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,140评论 6 397
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,895评论 1 308
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,535评论 3 420
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,435评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,952评论 1 319
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,081评论 3 340
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,210评论 1 352
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,896评论 5 347
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,552评论 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,089评论 0 23
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,198评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,531评论 3 375
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,209评论 2 357

推荐阅读更多精彩内容