下面是 “教你轻松记住JS正则表达式” 的完整攻略。
一、正则表达式
正则表达式是一种可以用于匹配文本特定模式的表达式,也可称之为正则或RegExp。JavaScript 支持正则表达式,其构造函数即RegExp。
1.1 正则表达式的构造函数
在 JavaScript 中 RegExp
是正则表达式的构造函数,我们可以使用它创建正则表达式,语法如下:
var regExp = new RegExp(pattern, flags);
其中 pattern
为正则表达式的模式,flags
为修饰符(可选),修饰符可以去掉或添加某些功能。
示例:
var regExp1 = new RegExp('hello');
var regExp2 = new RegExp('hello', 'i');
以上代码创建了两个正则表达式,分别匹配字符串中的 "hello",但 regExp2
使用 'i' 修饰符表示匹配不区分大小写。
1.2 正则表达式的字面量
除了使用 RegExp
构造函数,JavaScript 还提供了一种简单的字面量(literal)形式来创建正则表达式。字面量创建正则表达式的形式为:/pattern/flags
。
示例:
var regExp3 = /hello/;
var regExp4 = /hello/i;
以上代码同样创建了两个正则表达式,分别匹配字符串中的 "hello",但 regExp4
使用 'i' 修饰符表示匹配不区分大小写。
二、正则表达式的元字符
正则表达式中的元字符指的是有特殊含义的字符,能够通过它们来构造规则。下面列出一些常用的元字符及其含义:
.
:匹配除了换行符以外的任何字符。\d
:匹配数字,相当于[0-9]
。\D
:匹配非数字,相当于[^0-9]
。\w
:匹配单词字符(字母、数字、下划线),相当于[A-Za-z0-9_]
。\W
:匹配非单词字符,相当于[^A-Za-z0-9_]
。\s
:匹配空白字符,包括空格、制表符、换页符等。\S
:匹配非空白字符。^
:匹配开头,表示以某个字符或某种类型字符开头。$
:匹配结尾,表示以某个字符或某种类型字符结尾。
示例:
var str = 'I love JavaScript.';
var regExp5 = /I/;
var regExp6 = /script\./i;
var regExp7 = /\d+/;
var regExp8 = /\W/;
以上代码分别创建了四个正则表达式:regExp5
匹配以 "I" 开头的字符串,regExp6
匹配以 "script." 结尾的字符串("." 在正则表达式中需要转义),regExp7
匹配字符串中的数字,regExp8
匹配非单词字符。
三、正则表达式的修饰符
上文提到过,正则表达式的修饰符可以去掉或添加某些功能。下面列出一些常用的修饰符:
g
:全文查找,即找到所有匹配项。i
:忽略大小写。m
:多行匹配。
示例:
var str1 = 'HeLLo worLD.';
var regExp9 = /l/;
var regExp10 = /l/g;
var regExp11 = /l/i;
以上代码分别创建了三个正则表达式:regExp9
匹配第一个字符 "l",regExp10
匹配所有的字符 "l",regExp11
匹配不区分大小写的字符 "l"。
四、正则表达式的使用
正则表达式可以应用于多种场景中的文本匹配,例如验证手机号、邮箱、密码、身份证号等。在 JavaScript 中,我们通常使用正则表达式配合 String
类型的方法进行文本匹配。
4.1 test()
方法
test()
方法用于检测字符串中是否存在指定的模式,并返回 true
或 false
。
语法:regExp.test(string)
示例:
var regExp12 = /\d+/;
regExp12.test('12345'); // true
regExp12.test('abc'); // false
以上代码使用 test()
方法检测字符串中是否存在数字,返回结果分别为 true
和 false
。
4.2 exec()
方法
exec()
方法用于在字符串中执行正则表达式搜索,返回包含结果的数组或 null
。
语法:regExp.exec(string)
示例:
var regExp13 = /(\d+)-(\d+)-(\d+)/g;
var str2 = '2019-9-10, 2019-9-15';
var result = [];
var temp;
while((temp = regExp13.exec(str2)) != null) {
result.push(temp[0]); // 注意数组下标
}
console.log(result); // ["2019-9-10", "2019-9-15"]
以上代码使用 exec()
方法以全局匹配的方式获取日期字符串中的年月日信息。
五、正则表达式的捕获分组
在正则表达式的模式中,我们还可以指定捕获分组,用于抽取我们所需的信息。捕获分组的格式是 "()",其中可以嵌套括号,同一正则表达式中可以有多个捕获分组。
示例:
var regExp14 = /(\d{4})-(\d{2})-(\d{2})/;
var str3 = '2019-09-15';
var match = regExp14.exec(str3);
console.log(match); // ["2019-09-15", "2019", "09", "15", index: 0, input: "2019-09-15", groups: undefined]
console.log(match[1]); // "2019"
console.log(match[2]); // "09"
console.log(match[3]); // "15"
以上代码通过捕获分组将日期字符串中的年、月、日信息分别提取出来。
六、编写正则表达式要注意的细节
编写正则表达式时需要注意以下几点:
- 将正则表达式封装在函数中,以便重复调用。
- 使用
test()
方法判断基本的匹配情况。 - 尽可能使用字面量形式的正则表达式。
- 使用捕获分组获取所需的信息。
- 正则匹配的顺序很重要,应该将最精确的规则放在最前面。
七、总结
本文从正则表达式的构造函数、正则表达式的元字符、正则表达式的修饰符、正则表达式的使用、正则表达式的捕获分组以及编写正则表达式要注意的细节等方面分别进行了详细讲解,并给出了多个示例。掌握了上述知识点,相信读者已能够在 JavaScript 中运用正则表达式轻松地实现各种文本匹配操作。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:教你轻松记住JS正则表达式 - Python技术站