正则表达式1--string类中的方法

1. match()方法：根据正则匹配出所有符合要求的内容匹配成功后将其保存到数组中，匹配失败则返回false。

案例演示：

var str = "It's is the shorthand of it is";
var reg1 = /it/gi;
str.match(reg1);    // 表示不分大小写将全部it子串提取出来      匹配结果：(2) ["It", "it"]
var reg2 = /^it/gi;	
str.match(reg2);    // 表示不分大小写以it开头的子串提取出来    匹配结果：["It"]
var reg3 = /s/gi;	
str.match(reg3);    // 表示不分大小写将所有S子串提取出来            匹配结果：(4) ["s", "s", "s", "s"]
var reg4 = /s$/gi;
str.match(reg4);    // 表示不分大小写以S结尾的子串提取出来  匹配结果：["s"]

    注意： g  用于在目标字符串中实现全局匹配

                 i  忽略大小写

                ^  表示匹配行首的文本

                $  表示匹配行尾的文本

2.search()方法：search()方法可以返回指定模式的子串在字符串首次出现的位置，相对于indexOf()方法来说功能更强大。

案例演示：

var str = '123*abc.456';
console.log(str.search('.*'));      	// 表示星号前面的点出现0次或者多次，因为星号前没有点,所以索引结果为0，   输出结果：0
console.log(str.search(/[\.\*]/));   	// 中括号加入反斜杠之后变为转义字符，*第一次匹配的子串为3，所以输出结果：3

注意：    .    用于匹配除换行符以外的任意单个字符

                *   匹配*前面的字符零次或多次

                \\  表示转义字符

 3.split()方法：split()方法用于根据指定的分隔符将一个字符串分割成字符串数组，其分割后的字符串数组中不包括分隔符。

案例演示：按照字符串中的“@”和“.”两种分隔符进行分割。

var str = 'test@123.com';
var reg = /[@\.]/;  //以@和. 两种分隔符进行分割
var split_res = str.split(reg);
console.log(split_res);    // 输出结果：(3) ["test", "123", "com"]

   正则匹配方式分割字符串时，还可以指定字符串分割的次数。

var str = 'We are a family';
var reg = /\s/;
var split_res = str.split(reg, 2);
console.log(split_res);    // 输出结果：(2) ["We", "are"]

注意： \s 匹配空格（包括换行符、制表符、空格符等），相当于[\t\r\n\v\f]

4.replace()方法：用于替换字符串，用来操作的参数可以是一个字符串或正则表达式。

var str = 'Regular Capture';
var reg = /(\w+)\s(\w+)/gi;   // 表示空格前一个或多个字符，空格后一个或多个字符
var newstr = str.replace(reg, '$2 $1');    // 通过$运算符将两部分进行颠倒
console.log(newstr); // 输出结果为：Capture Regular

注意：\w 表示匹配字母或数字或下划线或汉字 

           \s 匹配空格          

下面匹配一个小案例  大家练练手呗！

查找并替换敏感词 

<div >
        <p>过滤前的内容：</p>
        <textarea name="" id = "pre" cols="30" rows="10" ></textarea>
        <button id = 'btn'>过滤</button>
</div>
<div>
        <p>过滤后的内容：</p>
        <textarea name="" id="res" cols="30" rows="10"></textarea>
</div>
 




<script>
        //给按钮注册绑定click事件
        let btn = document.querySelector('#btn');
            btn.addEventListener('click',function(){
              //创建正则对象，定义敏感词
               let reg = /(bad)|[\u4e00-\u9fa5]/gi  //  \u4e00-\u9fa5汉字的字符编码形式
               //获取过滤前的内容,用*替换敏感词
               let pre_value = document.querySelector('#pre').value;
               let res_value = pre_value.replace(reg,'*');
                  //将过滤后的字符串放入textarea
                      document.querySelector('#res').value = res_value;
       })
</script>

这里增加一个提示，大家务必记住奥！

定义查找并需要替换的内容规则，[\u4e00-\u9fa5]表示匹配任意中文字符

 最终的效果展示如下：

5. 附一些语法

 表1. 懒惰限定符

代码/语法	说明
*?	重复任意次，但尽可能少重复
+?	重复1次或更多次，但尽可能少重复
??	重复0次或1次，但尽可能少重复
{n,m}?	重复n到m次，但尽可能少重复
{n,}?	重复n次以上，但尽可能少重复

 表2.常用的元字符

代码	说明
.	匹配除换行符以外的任意字符
\w	匹配字母或数字或下划线或汉字
\s	匹配任意的空白符
\d	匹配数字
\b	匹配单词的开始或结束
^	匹配字符串的开始

表3.常用的限定符

代码/语法	说明
*	重复零次或更多次
+	重复一次或更多次
?	重复零次或一次
{n}	重复n次
{n,}	重复n次或更多次
{n,m}	重复n到m次

 表4.常用的反义代码

代码/语法	说明
\W	匹配任意不是字母，数字，下划线，汉字的字符
\S	匹配任意不是空白符的字符
\D	匹配任意非数字的字符
\B	匹配不是单词开头或结束的位置
[^x]	匹配除了x以外的任意字符
[^aeiou]	匹配除了aeiou这几个字母以外的任意字符