JavaScript高级---(8)正则表达式

x33g5p2x  于2021-09-24 转载在 JavaScript  
字(4.0k)|赞(0)|评价(0)|浏览(311)

一、概述

正则表达式( Regular Expression )是用于匹配字符串中字符组合的模式。在 JavaScript中,正则表达式也是对象。
正则表通常被用来检索、替换那些符合某个模式(规则)的文本,例如验证表单:用户名表单只能输入英文字母、数字或者下划线, 昵称输入框中可以输入中文(匹配)。此外,正则表达式还常用于过滤掉页面内容中的一些敏感词(替换),或从字符串中获取我们想要的特定部分(提取)等 。

二、正则表达式的使用

1、创建

在 JavaScript 中,可以通过两种方式创建一个正则表达式。

  1. 利用RegExp对象来创建
var regexp = new RegExp(/123/);
 console.log(regexp);
  1. 利用字面量创建
var re = /123/;
 console.log(re);

2、测试正则表达式 test

test() 正则对象方法,用于检测字符串是否符合该规则,该对象会返回 true 或 false,其参数是测试字符串。

用法: regexObj.test(str)

  1. regexObj 是写的正则表达式
  2. str 我们要测试的文本
  3. 就是检测str文本是否符合我们写的正则表达式规范.
var re = /123/;
console.log(re.test('123'));

三、正则表达式中的特殊字符

一个正则表达式可以由简单的字符构成,比如 /abc/,也可以是简单和特殊字符的组合,比如 /ab/*c/ 。其中特殊字符也被称为元字符,在正则表达式中是具有特殊意义的专用符号,如 ^ 、$ 、+ 等。

我们分几类简单介绍一下:

1、边界符

// 边界符 ^$
        var re = /abc/;
        // 只要包含abc就为true
        console.log(re.test('abc'));
        console.log(re.test("abcd"));
        console.log(re.test("aabcd"));
        console.log("-------------");

        var reg = /^abc/; // 以abc开头为true
        console.log(reg.test('abc'));
        console.log(reg.test("abcd"));
        console.log(reg.test("aabcd"));
        console.log("-------------");

        var reg1 = /^abc$/; // 必须是abc
        console.log(reg1.test('abc'));
        console.log(reg1.test("abcd"));
        console.log(reg1.test("aabcd"));
        console.log("-------------");
  • 如果正则表达式形如/abc/,则表示只要测试内容包含abc即可为true。
  • 如果正则表达式形如/^abc/,则表示测试内容必须以abc开头才返回true。
  • 如果正则表达式形如/^abc$/,则表示测试内容必须为abc才返回true。

2、字符类

字符类表示有一系列字符可供选择,只要匹配其中一个就可以了。所有可供选择的字符都放在方括号内。
(1) [] 方括号
只要包含[]里面的任意一个字符即可返回true。

// 字符类:[] 表示包含[]里面的任意一个字符即可
        var rg = /[abc]/;
        console.log(rg.test('andy')); // true
        console.log(rg.test('color')); // true
        console.log(rg.test("red")); // false

(2)[-] 方括号内部 范围符-
例如[a-z]表示从a-z的所有字母

// [-] 范围
        var rg1 = /^[a-z]$/;
        console.log(rg1.test("a")); // true
        console.log(rg1.test("z")); // true
        console.log(rg1.test("A")); // false
        console.log(rg1.test("11")); //false

(3)[^] 方括号内部 取反符^
方括号内部加上 ^ 表示取反,只要包含方括号内的字符,都返回 false 。

// []里面有^表示取反, 表示不能包含
        var reg1 = /^[^a-zA-Z0-9_-]$/;
        console.log(reg1.test('a'));
        console.log(reg1.test('4'));
        console.log(reg1.test('+'));

注意和边界符 ^ 区别,边界符写到方括号外面。

3、量词符

正则表达式中也可以包含一些量词符来方便操作。

// 1. * 重复>=0次
        var reg = /^a*$/;
        console.log(reg.test(""));
        console.log(reg.test("aaaaaaa"));
        console.log("-----------------------");

        // 2. + 重复>=1次
        var reg = /^a+$/;
        console.log(reg.test(""));
        console.log(reg.test("aaaaaaaa"));
        console.log("-----------------------");

        // 3. ? 重复一次或者零次
        var reg = /^a?$/;
        console.log(reg.test("dfghj"));
        console.log(reg.test(""));
        console.log(reg.test("a"));
        console.log(reg.test("aa"));
        console.log("-----------------------");

        // 4. {n} 重复n次
        var reg = /^a{3}$/;
        console.log(reg.test(""));
        console.log(reg.test("a"));
        console.log(reg.test("aaa"));
        console.log("-----------------------");

        // 5. {n,} >=n次
        var reg = /^a{3,}$/;
        console.log(reg.test(""));
        console.log(reg.test("aaaaaa"));
        console.log(reg.test("aaa"));
        console.log("-----------------------");

        // 6. {m,n} >=m && <=n次
        var reg = /^a{3,5}$/;
        console.log(reg.test(""));
        console.log(reg.test("aaaaa"));
        console.log(reg.test("aaaaaaaaaaa"));
        console.log("-----------------------");

括号总结
正则表达式中有这么多的括号,他们都表示什么意思呢?我们现在做一个总结:

// 中括号 字符集和,匹配括号中的字符
        var reg = /^[]$/;

        // 大括号 量词符 重复次数
        var reg = /^abc{3}$/; // abccc

        // 小括号 表示优先级
        var reg = /^(abc){3}$/;
        console.log(reg.test("abcabcabc")); // true

4、预定义类

预定义类指的是某些常见模式的简写方式。

// \d匹配整数
        var reg = /^\d$/;

        // \D匹配非数字
        var reg = /^\D$/;

        // \w匹配任意的字母数字下划线 /a-zA-z0-9_/
        var reg = /^\w$/;

        // \W除了字母数字下划线
        var reg = /^\W$/;

        // \s 匹配是否为空
        var reg = /^\s$/;

        // \S 非空

四、正则表达式的替换

在游戏中,你是否见到过左下角聊天框内容含有**这样的字符,这是因为聊天内容含有敏感词汇而被和谐掉了,正则表达式也可以实现这样的操作。
其方法如下:

比如下面这个例子,我想要屏蔽掉**激情/*/*这个词

var strs = "今天真是美好的一天,同学们激情四射,激情的讨论";
        var newStr = strs.replace(/激情/, "**");
        console.log(newStr);

看看结果输出,激情确实被屏蔽了,但是第二个并没有被屏蔽,这是因为replace只能替换掉第一次出现的元素。

这时候怎么办呢?我们可以使用正则表达式的修饰符,其参数如下:

我们只需要在正则表达式后面加上一个g,就可以全局替换。

var strs = "今天真是美好的一天,同学们激情四射,激情的讨论";
var newStr = strs.replace(/激情/g, "**");
console.log(newStr);

看看输出结果:

ES6系列:
ES6—(1)新增语法及扩展方法

相关文章