作为前端开发里的一道必学技能,JavaScript正则表达式(JavaScript Regular Expression,简称JS Regex)的应用越来越广泛。不管你是在前端的表单验证、数据验证,还是在Node.js的后端开发中,都离不开正则表达式的使用。
那么JavaScript正则表达式到底是什么呢?它到底有什么样的基本语法和高级应用呢?我们来深入了解一下。
一、基础概念
正则表达式是一种描述字符模式的方法,它主要用于字符串匹配、查找和替换等操作。JS Regex是描述字符模式的语言,它由字符和操作符组成。这些字符和操作符可以表示字符模式,并可以配合各种匹配规则执行文本匹配及转换任务。JS Regex具有简洁、清晰、简单的语法,使用方便,而且是跨平台的标准。
正则表达式中的特殊字符:
1. 字符组
用中括号`[]`表示,表示可以匹配其中任意一个字符。如`/[abc]/`可以匹配字符串`a`或`b`或`c`。在字符组中可以用连字符`-`表示连续的字符。如`/[1-5]/`可以匹配`1`到`5`之间的任何一个数字。
2. 重复字符
重复字符是指某些符号或者字符可以出现多次或者不出现或者出现一次,常用的有`*`、`+`、`?`、`{}`。
- `*`:前面字符重复0次或多次。
- `+`:前面字符重复1次或多次。
- `?`:前面字符出现1次或不出现。
- `{n}`:前面字符重复出现n次。
- `{n,}`:前面字符重复出现n次或多次。
- `{n,m}`:前面字符重复出现n到m次。
3. 或者
用竖线`|`表示,表示可以匹配其中一个表达式。如`/china|usa/`可以匹配字符串`china`或`usa`
4. 特殊字符
特殊字符包括空格字符、制表符、换行符等,这些字符不能直接在正则表达式中使用。需要使用转义字符`\`表示。如`\t`表示制表符,`\n`表示换行符。
二、基本使用
在JavaScript中,我们可以使用RegExp对象创建正则表达式。正则表达式可以直接写在一个字符串里面,也可以使用RegExp对象进行创建。如下面两种写法都是正确的。
1. 直接写在字符串里:
```js
const str = 'hello world';
const reg = /world/;
console.log(str.match(reg)); //["world"]
```
2. 使用RegExp对象:
```js
const str = 'hello world';
const reg = new RegExp('world');
console.log(str.match(reg)); //["world"]
```
其中`match()`是用于在字符串中匹配正则表达式的方法,返回一个包含匹配的结果的数组。如果没有找到匹配的内容,则返回`null`。
当然,在使用正则表达式之前,我们需要掌握正则表达式的语法规则,以便正确使用。
三、高级应用
正则表达式本身是具有强大的功能的,常常可以发挥出出其威力。
1. 匹配IP地址
匹配IP地址时,我们可以使用`\d{1,3}`来匹配IP地址的每一个部分,使用`\.`来匹配IP地址中的每个`.`
```js
const str = 'my ip address is 192.168.0.1';
const reg = /\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}/;
console.log(str.match(reg)); //["192.168.0.1"]
```
2. 匹配URL
匹配URL时,我们需要使用协议,域名以及后面的路径。
```js
const str = 'my website is https://www.baidu.com/index.html';
const reg = /(https|http):\/\/([a-zA-Z0-9_]+\.){0,}[a-zA-Z0-9_]+\.[a-zA-Z]{2,3}(\/[a-zA-Z0-9_]+)*(\.[a-zA-Z0-9]{1,4})?/;
console.log(str.match(reg)); //"https://www.baidu.com/index.html"
```
这里的`https|http`用于匹配协议名,`([a-zA-Z0-9_]+\.){0,}`用于匹配二级或以上的域名,`[a-zA-Z0-9_]+\.[a-zA-Z]{2,3}`匹配一级域名,`(\/[a-zA-Z0-9_]+)*`匹配路径,`(\.[a-zA-Z0-9]{1,4})?`匹配可能存在的文件扩展名。
3. 查找重复单词
在文本中查找重复的单词时,我们可以使用`/\b(\w+)\b(\s+\1\b)+/ig`正则表达式,其中`\b`表示单词的边界,`\w`表示单词,`+`表示匹配一个或多个字符,`\1`表示之前捕获的第一个单词。
```js
const str = 'hello hello world world to to all';
const reg = /\b(\w+)\b(\s+\1\b)+/ig;
console.log(str.replace(reg, '$1')); //"hello world to all"
```
4. 密码强度校验
密码校验用正则表达式也十分方便。我们可以使用`/^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*?_~]).*$/`这个正则表达式来匹配强密码。
```js
// 密码:8位以上,包含大小写字母,数字和特殊字符
const passwordReg = /^.*(?=.{8,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*?_~]).*$/;
console.log(passwordReg.test('Hlx123@')); //false
console.log(passwordReg.test('Hlx123@45')); //true
```
其中`?=`被称为前瞻性断言,它是正则表达式中一种比较高级的用法。
上述只是使用正则表达式的一些基本应用案例,正则表达式的应用十分广泛,嵌入到程序中来,可以避免很多位置的检查,提高代码的可读性、可维护性和可重用性。
综上所述,正则表达式在JavaScript中以其简单易学、表达能力强、运行效率高等特点成为了开发者必不可少的工具之一。虽然在使用中遇到难度是难免的,但是掌握了基本的语法规则和高级应用,我们可以轻松处理很多复杂的文本操作。