JavaScript中的正则表达式

01_复习字符串的操作

字符串是可以循环的

    function findNum(str){

        var arr =[];
        var temp = '';

        for(var i =0;i<str.length;i++){

            if(str.charAt(i)<='9'&&str.charAt(i)>='0'){
                temp +=str.charAt(i);
            }else{
                if(temp){
                    arr.push(temp);
                    temp = '';
                }
            }
        }

        if(temp){
            arr.push(temp);
            temp = '';
        }
        return arr;
    }
indexOf();
substring();
charAt();
spilt();

02_什么是正则和正则的写法

正则:也叫规则,让计算机能够读懂人类的规则

    /*和上文效果一样*/
    /*正则表达式比传统的方法性能要好*/

    function findNum(str){

        return str.match(/\d+/g);
    }

应用场景:比如说注册账号

正则都是用来操作字符串

正则其实也是一个系统对象


    var re = new RegExp('a');
    var res = //; 
//平时建议使用简写方式,简写方式比全写的方式性能要好。
//如果为空是注释。
//里面的东西并不是字符串

正则表达式的常用方法

  • test:字符串判断
  • search:字符串搜索
  • match 获取匹配的项目
  • replace 替换所有字符串'

正则中的test方法

//正则去匹配字符串,如果匹配成功就返回true,匹配失败就返回false。、
    //一般test就是做判断的

    var str = 'abcdef';

    var re = /b/;//里面的东西是一个整体

    alert(re.test(str));


/*
* 转义字符:
* \s 空格
* \S 非空格
* \d 数字
* \D 非数字
* \w 字符 [包括 字母 数字 下划线]
* \W 非字符
* */

/*
* RegExpObject.test(string)
*
* 如果字符串 string 中含有与 RegExpObject 匹配的文本,则返回 true,否则返回 false。
* */
var str = '12345678ziMu90';

var re = /\d/g; // 是扫描全部,全局不全局好像没啥关系

alert(re.test(str));//返回的true

正则中的search方法

console.log(str.search(/b/));//正则也可以直接这么写
正则默认区分大小写,如果不区分大小写,在/后面添加标识符 i

/*
* 正则去匹配字符串,如果匹配成功,就返回匹配成功的位置,如果匹配失败就返回-1
*
* 字符串.search(正则);
*
* 正则当中默认区分大小写,如果不区分大小写的话,就添加i
*  */

var str = 'abcdefg';
    var re = /b/;
    var re_t = /G/i;
    var re_s = new RegExp('G','i');

    console.log(str.search(re));
    console.log(str.search(re_t));
    console.log(str.search(re_s));

正则中的match方法

    /*
    * match:正则去匹配字符串,如果匹配成功,就返回匹配成的数组,如果失败,就返回null
    *
    * 正则默认行为是匹配成功就会结束,不会继续匹配。
    *
    * 添加 G,全局匹配
    *
    * 找[固定]两位是\d\d
    *
    * 量词: 匹配不确定位置。+至少出现一次-> <=1
    *
    * */
    var str = 'hao432423hio52345huj2il';

    var re = /\d+/g;

    console.log(str.match(re));

正则中的replace方法

/*
*replaceChild();//替换节点
* replace :正则去匹配字符串,匹配成功的字符去替换新的字符串
*
* 字符串.replace(正则,新的字符串);
* */
// 默认行为是只替换一个
    var str = 'aaa';
    var re = /a/;
    var re = /a+/g; //这样就只有一个b了
    var str_1 = str.replace(re,'b');


    console.log(str_1);

正则中小括号的作用

    btn.onclick = function(){

        var re = /中国|美丽/g;

        text_2.value = text_1.value.replace(re,'**');
    }
    btn.onclick = function(){

        var re = /中国|美丽的船/g;

        text_2.value = text_1.value.replace(re,function($0){

            // 函数的第一个参数,就是匹配成功的字符,第二个参数可以是字符串也可以是回调函数
            //函数的第一个参数,就是匹配成功的字符
            var resule = '';

            for(var i=0;i<str.length;i++){

                resule+='*';
            }

            return resule;
        });

    }
//匹配子项:小括号() ,还有另外一层意思就是分组操作

    var re = /(\d-)+/g;
    var str = '2013-6-7';

//    var re = /(\d-)+/g

    var re = /(\d+)-/g;
    str.replace(re,function(str){

        /*
        * 第一个参数是母亲匹配的结果,第二个参数是第一个孩子匹配的结果,第三个参数是第二个孩子匹配的
        * */

/*如果小括号后面有不是孩子的符号,孩子也会加上飞括号的符号*/
        alert(str);
    })
// 需求:更改为 2013.6.7
    var str = '2013-6-7';

    var re =/-/g;
    
    var res = /(\d+)(-)/g;

    var newStr = str.replace(re,function($0,$1,$2){
        return '.';
          // $0就是匹配成功的字符
        //return $1+'';//res
        //return $0.substring(0,$0.length-1)+'.';//res
    });

var re = /(\d+)+/g;//+是针对的分组整体

  var str = 'abc';
    var re = /(a)(b)(c)/;
    
    alert(str.match(re));//[abc,a,b,c] 当match不加g的时候,才可以获取到子项的集合

正则中的字符类


    /*
    * [] 代表一个字符类,表示或 -> [abc] = a||b||c,整体代表一个字符
    *
    *     var re = /a[bde]c/;
    *    //var str = 'abdc'//这样返回的就是false
    * */

    var str = 'abc';
    var re = /a[bde]c/;//他只有三位

    alert( re.test(str));
  // 排除 :^ 如果^写在[]里面的话,就代表排除的意思
    //缩写 [a-z] 从小到大
    var re = /a[a-z0-9A-Z]c/;      这样也是可以的,其实只代表一位~
    var re = /a[a-z0-9A-Z]+c/;      这样也是可以的,其实只代表一位,但是可以出现一次或者多次~


//去掉html标签
    btn.onclick = function(){

        var re = /<[a-z0-9A-Z/]+>/g;
      //var re = /<[^>]+>/g;//不加上加号表示一个字符
        textTwo.value = textOne.value.replace(re,'');
    }

在正则当中有很多方法可以写出来,中括号里面都是或者的关系。

正则中的转义字符

/*
* . 任意字符 (\.代表真正的.)
* \s 空格
* \S 非空格
* \b 单词边界
* \B 非单词边界
* */

var str = 'abc';

var re = /a.c/;
//var re = /a\.c/;//这个才是真正的.
    /*
    * \b 独立的部分 -> 起始 结束 空格
    * \B 非独立的部分
    * */

    var str = 'one two';

    var re = /\bone\b/;
    alert(re.test(str));
function getByClass(oParent,sClass){

        var arr = [];
        var aElement = oParent.getElementsByTagName('*');
//        var re = /sClass/; 直接写并不会认为是传参
        var re  = new RegExp('\\b'+sClass+'\\b');//字符串一些特殊字符是不能够直接输出的5


        for(var i=0;i<aElement.length;i++){

            if(re.test(aElement[i].className)){

                arr.push(aElement[i]);
            }
        }
        console.log(arr);
        return arr;
    }

    alert('\\');// \ 不能够直接进行输入,要再添加一个\
    /*有些字符不能直接执行*/

正则中的重复子项

/*
* \1 重复子项
*
* \1 重复的第一个子项 [完全一样]
* \2 重复的第二个子项 [完全一样]
* */

    var str = 'abca';

    var re = /(a)(b)(c)\1/;

    alert(re.test(str));
//找出重复字符,并且统计得出重复次数

    var str = 'asssssjdsssassskkkkkvvvvssss';
    var arr = str.split('');

    str = arr.sort().join('');

    console.log(str);//adjkkkkksssssssssssssssvvvv

    var value = '';//表示值
    var index = 0;//表示出现的次数

    var re = /(\w)\1+/g;

    str.replace(re,function($0,$1){


        if(index<$0.length){

            index = $0.length;
            value = $1;
        }
    });

alert('出现最多的是'+value+'一共出现了'+index+'次');

正则中的量词和首尾匹配

    /*
    * 量词:用{}来表示
    * {4,7} 最少出现4次,最多出现7次
    * {4,} 最少出现4次
    * {4} 正好出现4次
    * +[一种简写] -> {1,} 最少出现一次
    * ?[一种简写] -> {0,1} 出现0次或者一次
    * *[一种简写] -> {0,} 至少出现0次
    * */

    var str = 'ab';
    var re = /ab+/;//表示b至少出现1次

    alert(re.test(str));//返回的是true
    /*
    *
    * ^ 放在正则的最前面位置,就代表着起始的意思
    * $ 正则的最后位置,就代表结束的意思
    * */
    var text = document.getElementById('text');
    var btn = document.getElementById('btn');

    var re = /^[1-9]\d{4,11}$/; //代表起始的位置必须是数字,结束的位置必须是4-11的数字

    btn.onclick = function(){

        if(re.test(text.value)){

            alert('是Q');
        }else{
            alert('不是Q');
        }
    }
//判断输入的是否是空格
    var str = ' hello ';

//    console.log(str);

    function trim(str){

        var re = /^\s+|\s+$/g;

        return str.replace(re,'');
    }


    console.log(str);
    console.log(trim(str));

建议把常用的添加到json中

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

推荐阅读更多精彩内容