javaScript正则表达式基础

小鱼儿 2022-12-15 11:03 169阅读 0赞

![e9455fc54bdd1c2787ff092bd7cc5bd6.png][]

# 匹配模式： #

正则表达式匹配模式的标记，下面中用到的/\\d+/g 中的g就是其中一种。

*  g：全局模式，表示查找字符串的全部内容，而不是找到第一个匹配的内容就结束。
 *  i：不区分大小写，表示在查找匹配时忽略pattern和字符串的大小写。
 *  m：多行模式，表示查找到一行文本末尾时会继续查找。
 *  y：粘附模式，表示只查找从lastIndex开始及之后的字符串。
 *  u：Unicode模式，启用Unicode匹配。
 *  s：dotAll模式，表示元字符.匹配任何字符（包括\\n或\\r）。

#### 1.字面量创建 ####

#### 2.构造函数创建 ####

//1.字面量创建
            let str = "abc1234dfa123";
            let reg = /\d+/g;
            let res = str.match(reg);
            console.log(res);
        
            //2.构造函数创建
            let str = "abc1234dfa123";
            let reg = new RegExp("\\d+", "g");
            let res = str.match(reg);
            console.log(res);

#### 3.正则对象的方法 ####

*  test 返回布尔值，表示是否能匹配到
 *  exec 返回匹配子字符串，非粘性模式下执行一次返回一个

// 正则对象底下的方法 
            // 1.test 返回布尔值，表示是否能匹配到
            let str = "abfda";
            let reg = /\d+/g;
            console.log(reg.test(str));
            
            // 2.exec 返回匹配子字符串，执行一次返回一个
            let str = "abf1234da123";
            let reg = /\d+/g;
            console.log(reg.exec(str));
            console.log(reg.lastIndex);
            console.log(reg.exec(str));
            console.log(reg.lastIndex);
            console.log(reg.exec(str));

#### 4.字符串方法 ####

*  split 按照正则规则分隔字符串
 *  search 返回匹配默认第一个元素的位置，不全局
 *  match 进行正则匹配，返回匹配结果
 *  replace 替换匹配的值

// 字符串方法
            // 1.split 按照正则规则分隔字符串
            let str = "asfhk121asdad123";
            let arr = str.split(1);
            let arr2 = str.split(/\d+/);
            console.log(arr, arr2);
        
            //2.search search 返回匹配默认第一个元素的位置，不全局
            let str = "safk123asdak123";
            let reg = /\d+/;
            let reg2 = /\d+/g;
            let arr = str.search(reg);
            let arr2 = str.search(reg2);
            console.log(arr, arr2);
            
            //3.match 进行正则匹配，返回匹配结果
            let str = "sadsadjhk213asdf1312jfh";
            let reg = /\d+/g;
            console.log(str.match(reg));
        
            //4.replace 替换匹配的值
            let str = 'asdkj12321sadjk213';
            let arr = str.replace(/\d+/g, "*");
            console.log(arr);
            let arr2 = str.replace(/\d+/g, function(arg) { 
                console.log(arg);
                return '**'
            })
            console.log(arr2);

#### 5.元字符 ####

1.字符相关     
2.数量相关     
3.位置相关     
4.括号相关

1.  字符相关，字符相关的有&nbsp&nbsp \\w &nbsp\\W &nbsp \\d &nbsp \\D &nbsp \\s &nbsp\\S。&nbsp大小写作用相反。
    
    \\w : 数字、字母、下划线； &nbsp&nbsp \\W:非（数字、字母、下划线）
    
    \\d : 数字； &nbsp&nbsp \\D：非数字
    
    \\s ：空格； &nbsp&nbsp \\S：非空格
    
    . 表示非 \\n \\r \\u2028 \\u2029;

// \w : 数字、字母、下划线 \W:非（数字、字母、下划线）
            let str = '123fdfs# ###%%%__';
            let reg = /\w+/g;
            console.log(str.match(reg));
        
            let reg2 = /\W+/g;
            console.log(str.match(reg2));
        
            // \d:数字 \D：非数字
            let str = '123fdfs# ###%%%__';
            let reg = /\d+/g;
            console.log(str.match(reg));
        
            let reg2 = /\D+/g;
            console.log(str.match(reg2));
        
            // \s：空格 \S：非空格
            let str = '123fdfs# ###%%%__';
            let reg = /\s+/g;
            console.log(str.match(reg));
        
            let reg2 = /\S+/g;
            console.log(str.match(reg2));
        
            // . 非 \n \r \u2028 \u2029;
            let str = '123fdfs# ###%%%__';
            let reg = /./g;
            console.log(str.match(reg));

1.  数量相关，数量相关的有 \*\*\{ \} ？+ \*\*\*
    
     *  首先看\*\*\{ \}\*\*，\{\}分为三种
    
    一为**固定值**，例如\{3\}。
    
    二为**指定范围**，例如\{2,5\}。
    
    三为**指定最小值**，例如\{1,\}

- ？相当于{0，1}         
      - +相当于{1，}         
      - *相当于{0，}

3. 位置相关，位置相关的有 **^ $ \\b \\B**。^表示字符开始，$表示字符结束，\\b表示边界符，\\B表示非边界符。

// 位置相关的有 ^ $ \b \B
            // ^表示字符开始
            let str = "abefsdsfsd";
            let reg = /^/g;
            console.log(str.replace(reg, "*"));
        
            // $表示字符结束
            let str = "abefsdsfsd";
            let reg = /$/g;
            console.log(str.replace(reg, "*"));
        
            // /b表示边界符，非\w都是边界
            let str = "my name is book";
            let reg = /\bis\b/g;
            console.log(str.replace(reg, "**"));
        
            // /B表示非边界
            let str = "my name is book";
            let reg = /\Bok\b/g;
            console.log(str.replace(reg, "**"));

1.  括号相关。**() \[ \] \{ \}** 其中\*\*\{ \}\*\*已经在前面提过

*  **（）有4种作用**，分别为分组，提取值，替换，反向引用

*  分组，其实我觉得就是一种优先级

//分组
            let str = "dkdkdk2311234";
            let reg = /(dk){3}/g;
            console.log(str.match(reg));

*  提取值

//提取值
            let str = "2020-10-03-04-05";
            let reg = /(\d{4})-(\d{2})-(\d{2})-(\d{2})-(\d{2})/;
            console.log(str.match(reg));
        
            // //RegExp可以存储最多9个捕获组的匹配项。这些属性通过RegExp.$1~RegExp.$9来访问，分别包含第1~9个捕获组的匹配项
            console.log(RegExp.$1);
            console.log(RegExp.$2);
            console.log(RegExp.$3);
            console.log(RegExp.$4);
            console.log(RegExp.$5);

课外小知识：RegExp可以存储最多9个捕获组的匹配项。这些属性通过RegExp.$1~RegExp.$9来访问，分别包含第1~9个捕获组的匹配项

*  替换

//替换
            let str = "2020-10-01";
            let reg = /(\d{4})-(\d{2})-(\d{2})/;
            console.log(str.replace(reg, "$3/$2/$1"));
            console.log(str.replace(reg, (arg, year, mounth, date) => { 
                return date + '/' + mounth + '/' + year; 
            }));

*  反向引用

//反向引用
            let className = "news-container-nav";
            // let reg = /\w{4}(-|_)\w{9}(-|_)\w{3}/;
            let reg = /\w{4}(-|_)\w{9}(\1)\w{3}/;
            console.log(className.match(reg));

**\[ \]** 作用就比较简单，就是字符集合，这里要注意^符在\[\]中是指非

// []作用就是字符集合,^符在[]中是指非
             let str = 'My name is liUuuudk';
            // let reg = /li[Uu]+dk/g;
            let reg = /[^0-9]/g;
            console.log(str.match(reg));

#### 5.命名分组 ####

//命名分组
            let str = "2020-10-01";
            let reg = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;
            console.log(str.match(reg));//打开控制台，可以看到groups里有值

#### 6.零宽断言 ####

*  正向零宽断言
    
     *  肯定

// 正向零宽断言
            // 分为肯定和否定
            let str = "iphone2iphone3iphone4iphonenumber";
            // 肯定
            let reg1 = /iphone(?=\d)/g; //当iphone后是数字
            console.log(str.replace(reg1, "苹果"));

- 否定

// 否定
            let reg2 = /iphone(?!\d)/g; 当iphone后不是数字
            console.log(str.replace(reg2, "苹果"));

*  反向零宽断言
    
     *  肯定

// 反向零宽断言
            // 分为肯定和否定
            let str = '10px20px30pxsspx';
            //肯定
            let reg1 = /(?<=\d+)px/g;
            console.log(str.replace(reg1, "像素"));

- 否定

//否定
            let reg2 = /(?<!\d+)px/g;
            console.log(str.replace(reg2, "像素"));

[e9455fc54bdd1c2787ff092bd7cc5bd6.png]: /images/20221123/dffc0d4912cf44b7887eeae3ba6242b1.png