正则表达式（下）

最新推荐文章于 2022-04-12 09:17:17 发布

陛下，再来一杯娃哈哈

最新推荐文章于 2022-04-12 09:17:17 发布

阅读量311

点赞数

文章标签：正则表达式前端后端

本文链接：https://blog.csdn.net/m0_46420078/article/details/122443935

版权

一、量词符与括号字符

（1）量词符

量词符：用来设定某个模式出现的次数。

字符	说明	示例	结果
?	匹配?前面的字符零次或一次	hi?t	可匹配ht和hit
+	匹配+前面的字符一次或多次	bre+ad	可匹配范围从bread到bre…ad
*	匹配*前面的字符零次或多次	ro*se	可匹配范围从rse到ro…se
{n}	匹配{}前面的字符n次	hit{2}er	只能匹配hitter
{n,}	匹配{}前面的字符最少n次	hit{2,}er	可匹配范围从hitter到hitt…er

var reg = /^a*$/;        // * 相当于>=0，可以出现0次或很多次
var reg = /^a+$/;        // + 相当于>=1，可以出现1次或很多次
var reg = /^a?$/;        // ? 相当于1||0，可以出现0次或1次
var reg = /^a{3}$/;      // {3}就是重复a字符3次
var reg = /^a{3,}$/;    // {3,}就是重复a字符 大于等于3次
var reg = /^a{3,16}$/;  // {3,16}就是重复a字符 大于等于3次 小于等于16次

案例演示：允许用户输入6~16位的用户名

var reg = /^[a-zA-Z0-9_-]$/;
var reg = /^[a-zA-Z0-9_-]{6,16}$/;

（2）括号字符

改变限定符的范围：允许用户输入6~16位的用户名

使用（）符号前：

正则表达式：catch|er

可匹配的结果：catch、er

使用（）符号后：

正则表达式：cat(ch|er)

可匹配的结果：catch、cater

分组：使用小括号可以进行分组，当小括号后面有量词符时，就表示对整个组进行操作。

分组前：

正则表达式：abc{2}

可匹配的结果：abcc

分组后：

正则表达式：a(ab){2}

可匹配的结果：abcbc

（3）捕获与非捕获

捕获：使用小括号可以进行分组，当小括号后面有量词符是，就表示对整个组进行操作。

var res = '1234'.match(/(\d)(\d)(\d)(\d)/);
console.log(res);

案例演示：字符串内容位置替换

var str = 'Regular Capture';
var reg = /(\w+)\s(\w+)/gi;
var newstr = str.replace(reg, '$2 $1');
console.log(newstr); // 输出结果为：Capture Regular

捕获与非捕获： (?:x)方式实现非捕获

// ① 非捕获
var reg = /(?:J)(?:S)/;
var res = 'JS'.replace(reg,'$2 $1');
console.log(res); // 输出结果：$2 $1

// ② 捕获
var reg = /(J)(S)/;
var res = 'JS'.replace(reg,'$2 $1');
console.log(res); // 输出结果：S J

（4）贪婪与懒惰匹配

贪婪与懒惰匹配：所谓贪婪表示匹配尽可能多的字符，而惰性表示匹配尽可能少的字符。

懒惰匹配：正则匹配默认是贪婪匹配，通过 “?”符号实现惰性匹配。

var str = 'webWEBWebwEb';
var reg1 = /w.*b/gi;    // 贪婪匹配
var reg2 = /w.*?b/gi;   // 懒惰匹配
// 输出结果为：["webWEBWebwEb", index: 0, input: "webWEBWebwEb"]
console.log(reg1.exec(str)); 
// 输出结果为：["web", index: 0, input: "webWEBWebwEb"]
console.log(reg2.exec(str));

（5）反向引用

反向引用：获取存放在缓存区内的子表达式的捕获内容。

var str = '13335 12345 56668';
var reg = /(\d)\1\1/gi;
var match = str.match(reg);
console.log(match); // 输出结果为：(2) ["333", "666"]

（6）零宽断言

零宽断言：用于查找子表达式匹配的内容之前或之后是否含有特定字符集。

方式：正向预查和反向预查。

字符	说明	示例
x(?=y)	仅当x后面紧跟着y时，才匹配 x	Countr(?=y\|ies)用于匹配Country或Countries中的Countr
x(?!y)	仅当x后不紧跟着y时才匹配 x	Countr(?=y\|ies)用于匹配Country或Countries中的Countr

（7）正则表达式优先级

正则表达式优先级：正则表达式各种符号的优先级，由高到低排列

符号	说明
\	转义符
()、(?:)、(?=)、[]	圆括号和中括号
*、+、?、{n}、{n,}、{n,m}	限定符
^、$、\任何元字符、任何字符	定位点和序列
\|	“或”操作

案例：身份证号码验证

<body>
    <form id="form">
        身份证号：<input type="text" name="card">
    </form>
    <div id="result"></div>
    <script>
        let result = document.querySelector('#result');
        let inputs = document.getElementsByTagName('input');
        // inputs.card.onblur = function(){}
        inputs.card.addEventListener('blur',function(){
            //创建正则表达式对象
            let idCard = /(^\d{15}$)|(^\d{17}([0-9]|X))/
            //获取用户输入的身份证号码
            let userId = inputs.card.value;
            //进行验证
            if(idCard.test(userId)){
                result.innerHTML = "验证通过!"
            }else{
                result.innerHTML = "身份证号码错误!"
            }
        })
    </script>
</body>

二、String类中的方法

（1）match()方法

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

var str = "It is the shorthand of it is";
var reg1 = /it/gi;
console.log(str.match(reg1));

var reg2 = /^it/gi;
console.log(str.match(reg2));

var reg3 = /s/gi;
console.log(str.match(reg3));

var reg4 = /s$/gi;
console.log(str.match(reg4));

（2）search()方法

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

var str = '123*abc.456';
console.log(str.search('.*'));      	// 输出结果：0
console.log(str.search(/[\.\*]/));   	// 输出结果：3

（3）split()方法

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

A、按照字符串中的“@”和“.”两种分隔符进行分割。

var str = 'test@123.com';
var reg = /[@\.]/;
var split_res = str.split(reg);
console.log(split_res);    // 输出结果：(3) ["test", "123", "com"]

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

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

（4）replace()方法

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

var str = 'Regular Capture';
var reg = /(\w+)\s(\w+)/gi;
var newstr = str.replace(reg, '$2 $1');
console.log(newstr); // 输出结果为：Capture Regular

【案例】查找并替换敏感词

<body style="display: flex;">
    <div>
        <p>过滤前的内容：</p>
        <textarea  id="pre" cols="30" rows="10"></textarea>
        <button id="btn">过滤</button>
    </div>
    <div>
        <p>过滤后的内容：</p>
        <textarea 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
            //获取过滤前的内容,用‘*’替换敏感词
            let pre_value = document.querySelector('#pre').value;
            let res_value = pre_value.replace(reg,'*');
            //将过滤后的字符串放入textarea
            document.querySelector('#res').value = res_value;
        })
    </script>
</body>

陛下，再来一杯娃哈哈

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
正则表达式（下）

一、量词符与括号字符（1）量词符：量词符：用来设定某个模式出现的次数。字符说明示例结果 ? 匹配?前面的字符零次或一次 hi?t 可匹配ht和hit + 匹配+前面的字符一次或多次 bre+ad 可匹配范围从bread到bre…ad...
复制链接

扫一扫