美文网首页
23-第二十三章 RegExp

23-第二十三章 RegExp

作者: 晚溪呀 | 来源:发表于2019-02-18 01:46 被阅读0次

    前端常用正则表达式

    http://caibaojian.com/form-regexp.html

    https://www.jb51.net/article/118826.htm

    一、 什么是正则表达式

    正则表达式是描述字符模式的对象。

    正则表达式用于对字符串模式匹配及检索替换,是对字符串执行模式匹配的强大工具。
    StringRegExp 都定义了使用正则表达式进行强大的模式匹配和文本检索与替换的函数。
    正则表达式主要用来验证客户端的输入数据。可以节约大量的服务器端的系统资源,并且提供更好的用户体验。

    二、创建正则表达式

    1、直接量
    语法:
    Reg = /pattern/modifiers;
    var Reg = /box/gi;

    2、new RegExp
    语法
    Reg = new RegExp( pattern , modifiers );
    pattern ,modifiers 此时是字符串

    var Reg = new RegExp(“box”,”gi”);

    何种方法创建都是一样的
    pattern 模式 模板,要匹配的内容
    modifiers 修饰符

    三、正则表达式用法及区别

    1、String中正则表达式方法

    方法 描述

    match(Reg) 返回 RegExp 匹配成功的包含匹配内容信息的数组或 null
    search(Reg) 返回 RegExp 匹配字符串首次出现的位置
    replace(Reg,newStr)newStr 替换 RegExp 匹配结果,并返回新字符串
    split(Reg) 返回字符串按指定RegExp拆分的数组

    使用

    var str = 'hello';
    var Reg = /e/i;
    str.match(Reg);
    2、RegExp对象的方法
    方 法

    方法 描述

    exec() 在字符串中执行匹配搜索,返回首次匹配结果数组,
    test() 在字符串中测试模式匹配,返回 truefalse
    使用

    var pattern = new RegExp(“box”,”gi”);
    pattern.test(str);
    pattern.exec(str);

    注意区别正则方法和字符串方法使用避免混淆

    正则方法:pattern.test(str); 方法的主体是正则表达式
    字符串方法:str.match(pattern);方法的主体是字符串

    四、修饰符

    1、修饰符用于执行区分大小写和全局匹配:

    i忽略大小写匹配
    g 全局匹配,默认只匹配第一个元素,就不在进行匹配
    m 执行多行匹配

            var patt =  /pattern/i;         //忽略大小写匹配
            var patt =  /pattern/g;         //全局匹配
            var patt =  /pattern/m;         //执行多行匹配
    

    终点

    全局标识符 g 会影响我们的 lastIndex

    第一次从0开始找,寻找结束后,会从最后的下一位开始寻找
    每一次寻找都记录下一个值的序号

            let str = '124978';
            const reg = /\d+/g;
    
            console.log(reg.lastIndex); // 0
            console.log(reg.test(str)); // true
            console.log(reg.lastIndex); // 6
            console.log(reg.test(str)); // false
            console.log(reg.lastIndex); // 0
    
    2、pattern 模式

    1、基本匹配
    xxx ———————————匹配xxx字符

    var Reg = /abc/
    x|y|z —————————-匹配 xyz字符

    var Reg = /abc|bac|cba/; —————————- 匹配 abcbaccba

    2、[]
    [abc]———————————–匹配abc之中的任何一个字符


    [^abc]———————————匹配非a非b非c字符的


    [0-9]———————————匹配 09 之间的数字
    [a-z]———————————匹配小写 a 至小写 z 的字符
    [A-Z]———————————匹配大写 A 至大写 Z 的字符
    匹配中文 [\u4e00-\u9fa5]

    还可以组合 var Reg = /hello [0-9a-zA-z]/;

    范围词 [ ] 范围词里的每个字符间都是或者关系

          let str = '1123sdsadasdASDASD23456';
          let reg = /[a-zA-Z0-9]/;
          console.log(str.match(reg));  
         字母区间  小写:a-z  大写:A-Z  数字  0- 9
    

    中文区间 [\u4e00-\u9fa5]

    3、元字符(转义字符)

    . —————————————–匹配单个字符,除了换行和行结束符

    \w—————————————匹配单词字符,数字,(数字,字母,下划线)
    \W—————————————匹配非(单词字符和
    (下划线))

    \d —————————————匹配数字
    \D —————————————匹配非数字

    \s —————————————匹配空白字符(空格) 能匹配得到 \n, \r, \t
    \S —————————————匹配非空格字符

    \b —————————————匹配单词边界 (除了 字母 数字 _,其他的都算单词边界 (字) ) (开始位置,结束位置,/W)

          let str = 'huangchuxin黄 shi da shuai bi';
          let reg = /\bhuangchuxin\b/;
          console.log(reg.test(str)); //  true
    

    \B—————————————匹配非单词边界

    \n—————————————匹配换行符
    \r —————————————回车符
    \t —————————————制表符

    \' —————————————单引号
    \" —————————————双引号
    \& —————————————和号
    \\ —————————————反斜杠
    \f —————————————换页符

    | —————————————或者
    左边所有 或者 右边所有

    特殊的转译字符 . \ /
    1.var reg = /\./;  //匹配  .
    2.var reg = /\\/;  //匹配  \
    3.var reg = /\//;  //匹配  /
    

    4、量词

    量词是对前面一个字段的重复

    量词第二个值前面不能加括号,否则匹配失败

    默认往多的匹配 -- 贪婪
    {}
    {2,5} 最少2个,最多5个
    {2,} 最少2个
    {2} 精确的2个
    往少的匹配 -- 惰性
    量词后面加 ? 表示惰性

    1、n? {0,1} 可写 ?———————————匹配 0 个或一个n的字符串

    (匹配数字时,默认匹配一个,查询成功返回值,失败返回空字符串 '' 依次查询)

    2、n* {0,} 可写*———————————匹配 0 个或多个字符串(任意个)

    (匹配数字时,默认匹配一个,查询成功返回值,失败返回空字符串 '' 依次查询)

    3、n+ {1,} 可写 +———————————匹配至少一个 n 字符串
    4、n{X}——————————匹配包含 X 个 n 的序列的字符串
    5、n{X,Y}————————–匹配包含至少 X 或至多 Y 个 n 的序列的字符串
    6、n{x,}—————————-匹配至少 X 个 n 的序列字符串
    7、^n———————————匹配以 n 开头的字符串
    8、n$———————————匹配以 n 结尾的字符串

    5、贪 婪 惰 性

    贪婪: 尽可能多的匹配 (默认)
    惰性: 尽可能少的匹配
    前提条件都是要匹配到内容

    —— 贪 婪 —— —— 惰 性 ——

    +(1,) ———— +?
    ?(0,1) ———— ??
    *(0,) ———— *?
    {n} ———— {n}?
    {n,m} ———— {n,m}?
    {n,} ———— {n,}?

    6、子组(子表达式)

    子组:使用()小括号,指定一个子表达式后,称之为分组
    子集 () 划分整体 ,第一次的结果是整体规则的结果,往后的都是子集里面的结果
    子集划分的整体通过 $1,$2访问

            let str = '楚鑫帅逼';
            let reg = /(楚鑫)(帅逼)/;
            let s1 = str.replace(reg, '$2$1');
            console.log(s1)
            //  帅逼楚鑫
    
          let str = '123456';
          let reg = /(\d)2(\d)/;
          console.log(str.match(reg));  
          //  0:  123  1:  1  2:  3
    

    捕获型 非捕获型

    1)、捕获型

    正常子集里面的内容会被缓存起来,缓存起来证明要占用性能,要想子集里面的内容不被捕获使用不捕获匹配

            不捕获匹配
            /(?: (x|y|z))xx/;
    
          var str = 'abcdefg';
          var reg = /(abc)d/;//匹配abcd
          var val = reg.exec( str);
          console.log( val );   //["abcd", "abc", index: 0, input: "abcdefg"]
    

    1、索引0 为匹配的结果
    2、索引1 为第一个子表达式 匹配结果
    3、index :首次匹配成功的索引值,
    4、input: 匹配目标

    —— 字符 —— 引用
    (pattern)匹配pattern并捕获结果,自动设置组号,是从1开始的正整数 \num
    引用是值的引用,匹配结果的引用不是匹配形式引用

    对重复内容的提取
    \1出现在子集后面的时候表示对前面结果的重复

                let str = '1112233555';
                const reg = /(\d)\1+/g;
                console.log(str.match(reg)); // ["111", "22", "33", "555"]
    
    2)、非捕获型

    (?=匹配模式) 正向肯定 左边固定 右边筛选选择 (零宽度正向预言)
    (?!匹配模式) 正向否定 左边固定 右边筛选排除 (零宽度负向预言)

    (?<=匹配模式) 反向肯定 右边固定 左边筛选选择
    (?<!匹配模式) 反向肯定 右边固定 左边筛选排除

    (?:pattern) 不把子集里面的缓存起来

    起始和终止
    ^ 起始

            let s1 = '123456';
            let s2 = '123';
    
            let reg = /^123/;
    
            console.log(reg.test(s1));  //  true
            console.log(reg.test(s2));  //  true
    

    $ 终止

            let s1 = '123456';
            let s2 = '123';
    
            let reg = /^123$/;
    
            console.log(reg.test(s1));  //  false
            console.log(reg.test(s2));  //  true
    

    ^ 出现在范围词的时候,表示 不要

            let s1 = '123456';
            let s2 = '123';
    
            let reg = /[^\d]/;
    
            console.log(reg.test(s1));  //  false
            console.log(reg.test(s2));  //  false
    

    相关文章

      网友评论

          本文标题:23-第二十三章 RegExp

          本文链接:https://www.haomeiwen.com/subject/csroeqtx.html