正则表达式

Posted 2021-09-01 流走的年华

1.什么是正则表达式

(1)正则表达式是由一个字符序列形成的搜索模式；
(2)当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容；
(3)正则表达式可以式一个简单的字符，或式一个更复杂的模式
(4)正则表达式可用于所有文本搜索和文本替换的操作。

2.正则表达式的创建

(1)字面量（直接量）
    var reg=/正则表达式/修饰符;
    var reg = /hello/img;
(2)构造函数
    var reg = new RegExp(\'正则表达式\',\'修饰符\');
    var reg = new RegExp(\'hello\',\'img\');
其中i是ignoreCase,代表匹配时忽视大小写
m代表multiline,表示多行匹配
g代表global,表示全局匹配

3.正则表达式实例方法

(1)exec()  用来匹配字符串中符合正则表达式的字符串
    如果匹配到，返回一个数组[匹配到的内容，index：在str中匹配到的起始位置，input：参数字符串，groups：undefined]
    如果匹配不到，则返回null。
(2)test() 用来测试待检测的字符中是否有可以匹配到正则表达式的字符串，如果有返回true,否则返回false。
    注意：以上两种方法都会区分是否是全局的。
(3)toString/toLocaleString()  把正则表达式的内容转化成字面量形式字符串
(4)valueOf() 返回正则本身

4.正则表达式实例属性

(1)lastIndex
    当没设置全局匹配时，该值始终为0。设置了全局匹配时，每执行一次exec/test来匹配，lastIndex就会移向匹配到的字符串的下一个位置。当指向的位置后没有可以再次匹配的字符串时，下一次执行exec()返回null，test（）执行返回false，然后lastIndex归零，从字符串的开头重新匹配一轮。
(2)ignoreCase,global,multiline
(3)source 返回字面量形式的正则表达式

5.字符集合

一个字符集合，也叫字符组。匹配集合中的任意一个字符。你可以使用连‘—’指定一个范围。
(1)[abc]查找方括号之间的任何字符 
    var reg = /[abc]/ 
     console.log(reg.test(\'abc qwe abd\'));
    只要包含有a 或者 包含有b 或者包含有c 都返回true
(2)[0-9]查找任何从0到9的数字
(3)[^xyz]反义字符或补充字符集，也叫反义字符组。也就是说，它匹配任意不在括号内的字符。也可以通过使用连字符‘-’指定一个范围内的字符。
(4)边界符
    ^ 匹配输入开始。表示匹配行首的文本(以谁开始)。如果多行（multiline）标志设为true，该字符也会匹配一个断行符后的开始处。
    $ 匹配输入结尾。表示匹配行尾的文本（以谁结束）。如果多行（multiline）标志被设为true,该字符也会匹配一个断行符的前结尾处。
    如果^和$在一起，表示必须是精确匹配。
    var rg = /abc/; 
    // /abc/ 只要包含有abc这个字符串返回的都是true
    console.log(rg.test(\'abc\'));  //true
    console.log(rg.test(\'abcd\')); //true
    console.log(rg.test(\'aabcd\'));//true
    console.log(\'---------------------------\');
    // 必须是以abc开头的字符串才会满足
    var reg = /^abc/;
    console.log(reg.test(\'abc\')); // true
    console.log(reg.test(\'abcd\')); // true
    console.log(reg.test(\'aabcd\')); // false
    console.log(\'---------------------------\');
    // 必须是以abc结尾的字符串才会满足
    var reg = /abc$/;
    console.log(reg.test(\'abc\')); // true
    console.log(reg.test(\'qweabc\')); // true
    console.log(reg.test(\'aabcd\')); // false
    console.log(\'---------------------------\');
    var reg1 = /^abc$/; // 精确匹配 要求必须是 abc字符串才符合规范
    console.log(reg1.test(\'abc\')); // true
    console.log(reg1.test(\'abcd\')); // false
    console.log(reg1.test(\'aabcd\')); // false
    console.log(reg1.test(\'abcabc\')); // false
(5)字符集合与"^"和"$"一起使用
    // 三选一 只有是a 或者是 b  或者是c 这三个字母才返回 true
    var rg1 = /^[abc]$/; 
    console.log(rg1.test(\'aa\'));//false
    console.log(rg1.test(\'a\'));//true
    console.log(rg1.test(\'b\'));//true
    console.log(rg1.test(\'c\'));//true
    console.log(rg1.test(\'abc\'));//false
    //26个英文字母任何一个字母返回 true  - 表示的是a 到z 的范围  
    var reg = /^[a-z]$/ 
    console.log(reg.test(\'a\'));//true
    console.log(reg.test(\'z\'));//true
    console.log(reg.test(\'A\'));//false
    //字符组合
    // 26个英文字母(大写和小写都可以)任何一个字母返回 true
    var reg1 = /^[a-zA-Z0-9]$/; 
    //取反 方括号内部加上 ^ 表示取反，只要包含方括号内的字符，都返回 false 。
    var reg2 = /^[^a-zA-Z0-9]$/;
    console.log(reg2.test(\'a\'));//false
    console.log(reg2.test(\'B\'));//false
    console.log(reg2.test(8));//false
    console.log(reg2.test(\'!\'));//true
(6)\\b   匹配一个零宽单词边界（zero-width word boundary），表示一个单词（而非字符）边界，也就是单词和空格之间的位置，或者字符（\\w）与字符串开头或者结尾之间的位置。
    \\B  匹配一个零宽非单词边界（zero-width non-word boundary），与"\\b"相反。
    var str = \'Hello World Hello javascript\';
    var reg1 = /\\bHello\\b/g;
    var reg2 = /\\BScrip\\B/g;
    console.log(reg1.exec(str));
    console.log(reg2.exec(str));
(7)字符类
    . 匹配除换行符\\n和回车符之外的任何单个字符，等效于**[^\\n\\r]**
    \\d 匹配一个数字字符，等效于[0-9]
    \\D  [^0-9]
    \\w 匹配包括下划线的任何单个字符，包括A~Z，a~z，0~9和下划线**"_"**，等效于  [a-zA-Z0-9_]
    \\W [^a-zA-Z0-9_]
    \\s匹配任何Unicode空白字符，包括空格、制表符、换页符等，等效于[\\f\\t\\n\\r]
    \\S[^\\f\\t\\n\\r]
(8)数量词
    *   >=0次
    +   ≥1 次
    ？  0或1次
    {n} n 次
    {n,} ≥n 次
    {n,m} n到m 次

6.案例

(1)匹配QQ号
    // 不能以数字0开始，只能由数字组成，长度为5-11位
    var reg = /^[1-9]\\d{4,10}$/;
    var str1 = "12311111111";
    var result1 = reg.exec(str1);
    console.log(result1);
(2)匹配身份证号
    // 不能以数字0开头，只能由数字组成，最后一位可能是x，X，数字
    var reg = /^[1-9]\\d{16}[xX\\d]$/;
    var str = "456337189654326541";
    var result = reg.exec(str);
    console.log(result);
(3)验证是否为11位有效手机号码？
    以1为开头
    第二位为3，4，5，7，8中的任意一位
    最后以0-9的9个整数结尾
    var reg = /^1[34578]\\d{9}$/;
    var str = \'18376436798\';
    console.log(reg.exec(str));
(4)var pattern=/(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*[!|@|#|%|&])^([a-zA-Z0-9!@#%&]{6,})$/
    console.log(pattern.test(\'Ad5d6!\'));

7.重复方式

(1)贪婪模式：尽可能多的匹配（首先取最多可匹配的数量为一组进行匹配），当匹配剩余的字符串，还会继续尝试新的匹配，直到匹配不到为止，为默认模式。
    // 对字符串"123456789"，匹配其中的数字3-6次：\\d{3,6}，先匹配数字出现6次的字符串（123456），然后再从剩余字符串（789）中匹配出现数字3次的情况，剩余字符若没有出现数字3次则停止匹配.
    var str = "123456789";
    var reg = /\\d{3,6}/g;
    console.log(reg.exec(str)); //[ \'123456\', index: 0, input: \'12345678\', groups: undefined ]
    console.log(reg.exec(str)); // [ \'789\', index: 6, input: \'123456789\', groups: undefined ]
    console.log(reg.exec(str)); // null
(2)非贪婪模式：尽可能少的匹配（每次取最少匹配的数量为一组进行匹配），直到匹配不到为止
// 对字符串"123456789"，匹配其中的数字3-6次：\\d{3,6}，先匹配数字出现3次的字符串（123），然后再从剩余字符串（456789）中匹配出现数字3次的情况，剩余字符若没有出现数字3次则停止匹配.
    var str = "123456789";
    var reg = /\\d{3,6}?/g;
    console.log(reg.exec(str)); //[ \'123\', index: 0, input: \'123456789\', groups: undefined ]
    console.log(reg.exec(str)); // [ \'456\', index: 3, input: \'123456789\', groups: undefined ]
    console.log(reg.exec(str)); // [ \'789\', index: 6, input: \'123456789\', groups: undefined ]

8.选择，分组，引用

(1)选择
    字符"|"用于分隔供选择的字符，选择项的尝试匹配次序是从左到右，直到发现了匹配项，如果左边的选择项匹配，就忽略右边的匹配项，即使它可以产生更好的匹配。
    var reg = /html|css|js/

console.log(reg.exec(\'qweqwehtmlcss\')); // html

(2)分组
    下面的正则表达式可以匹配\'briupbriupbriup\'
        /briupbriupbriup/
        而另一种更优雅的写法是:/(briup){3}/
(3)候选
    一个分组中，可以有多个候选表达式，用 | 分隔：
             var reg = /I Like (basketball|football|table tennis)/
              console.log(reg.test(\'I Like basketball\')); //true
              console.log(reg.test(\'I Like football\')); //true
              console.log(reg.test(\'I Like table tennis\')); //true
(4)捕获与引用
    被正则表达式匹配（捕获）到的字符串会被暂存起来。其中，由分组捕获的串会从1开始编号，于是我们可以引用这些串：
    var reg = /(\\d{4})-(\\d{2})-(\\d{2})/

    var date = \'2021-08-29\'

    reg.test(date)
    // 捕获之前要先test/exec
    console.log(RegExp.$1); //2021
    console.log(RegExp.$2); //08
    console.log(RegExp.$3); //29
    $1引用了第一个被捕获的串，$2是第二个，依次类推。
(5)嵌套分组的捕获
    如果碰到类似/((apple) is (a (fruit)))/的嵌套分组，捕获的顺序是什么?
    var reg = /((apple) is (a (fruit)))/
    var str = "apple is a fruit"
    reg.test(str) // true
    RegExp.$1 // apple is a fruit
    RegExp.$2 // apple
    RegExp.$3 // a fruit
    RegExp.$4 // fruit
    规则是以左括号出现的顺序进行捕获
(6)引用
    正则表达式里也能进行引用，这称为反向引用：
    var reg = /(\\w{3}) is \\1/
    console.log(reg.test(\'kid is kid\')); // true
    console.log(reg.test(\'dik is dik\')); // true
    console.log(reg.test(\'kid is dik\')); // false
    console.log(reg.test(\'dik is kid\')); // false
    \\1引用了第一个被分组所捕获的串，换言之，表达式是动态决定的。

注意，如果编号越界了，则会被当成普通的表达式
    var reg = /(\\w{3}) is \\6/;
    reg.test( \'kid is kid\' ); // false
    reg.test( \'kid is \\6\' );  // true

9.String对正则表达式的支持

(1)search() 查找字符串中是否有匹配正则的字符串，有则返回字符串第一次出现时的位置，无则返回null,正则中无论是否有全局匹配都不会影响返回结果
(2)match() 匹配字符串中符合正则表达式的字符串，并返回该字符串的一个数组，其中包括字符串内容 、位置。如果正则设置全局匹配，则**一次性返回所有**符合正则表达式的字符串数组
  如果其中添加了分组，返回符合要求的字符串以及分组的一个数组，但如果同时开启全局匹配则不会在数组中添加分组内容
    var str = \'hello world hello\';
    var reg1 = /hello/;
    var reg2 = /hello/g;
    var reg3 = /(he)llo/;
    var reg4 = /(he)llo/g;
    // 匹配字符串中符合正则表达式的字符串，并返回该字符串的一个数组，其中包括字符串内容、位置
    // [ \'hello\', index: 0, input: \'hello world hello\', groups: undefined ]
    console.log(str.match(reg1));
    // 如果正则设置全局匹配，则一次性返回所有符合正则表达式的字符串数组
    // [ \'hello\', \'hello\' ]
    console.log(str.match(reg2));
    // 如果其中添加了分组，返回符合要求的字符串以及分组的一个数组
    // [
    //   \'hello\',
    //   \'he\',
    //   index: 0,
    //   input: \'hello world hello\',
    //   groups: undefined
    // ]
    console.log(str.match(reg3));
    // 如果同时开启全局匹配则不会在数组中添加分组内容
    // [ \'hello\', \'hello\' ]
    console.log(str.match(reg4));
(3)split() 
    // 以某种形式分割字符串 split()
    var str = "terry134briup156lisi12zhangsan";
    // 当数字出现一次或多次时
    var reg = /\\d+/;
    var result = str.split(reg);
    console.log(result); // [ \'terry\', \'briup\', \'lisi\', \'zhangsan\' ]
(4)replace()
    // 满足正则表达式条件的内容将被替换
    var str = \'javascript\'
    // 如果开启全局模式 则替换所有满足条件的字符
    var reg = /javascript/;
    // replace(正则表达式, 要替换的内容)
    var result = str.replace(reg, \'java\');
    console.log(result); //java
    console.log(str); //javascript

前瞻表达式

在正则表达式当中有个东西叫做前瞻，有的管它叫零宽断言

    |  (?=exp)   | 正向前瞻 | 匹配后面满足表达式exp的位置 |
    |  (?!exp)   | 负向前瞻 | 匹配后面不满足表达式exp的位 |
  var str = \'Hello, Hi, I am Hilary.\';
  // 后面一定要匹配什么
  var reg = /H(?=i)/g;
  var newStr = str.replace(reg, "T");
  console.log(newStr);//Hello, Ti, I am Tilary.
  在这个DEMO中我们可以看出正向前瞻的作用，同样是字符"H"，但是只匹配"H"后面紧跟"i"的"H"。就相当于有一家公司reg，这时候有多名"H"人员前来应聘，但是reg公司提出了一个硬条件是必须掌握"i"这项技能，所以"Hello"就自然的被淘汰掉了。
  那么负向前瞻呢？道理是相同的：
    var str = \'Hello, Hi, I am Hilary.\';
    // 后面一定要不匹配什么
    var reg = /H(?!i)/g;
    var newStr = str.replace(reg, "T");
    console.log(newStr);//Tello, Hi, I am Hilary.
    在这个DEMO中，我们把之前的正向前瞻换成了负向前瞻。这个正则的意思就是，匹配"H",且后面不能跟着一个"i"。这时候"Hello"就可以成功的应聘了，因为reg公司修改了他们的招聘条件，他们说"i"这门技术会有损公司的企业文化，所以我们不要了。