一、正则表达式是什么?
文字界的“搜索魔法”:通过特定符号组合描述文本规律,实现快速搜索/替换
类比:
- Ctrl+F 基础版 → 只能找固定文字
- 正则表达式 → 智能模糊搜索(如找所有手机号)
二、入门三步曲
A[明确要找什么] --> B[用符号描述特征]
B --> C[执行匹配]
案例:从文本中提取所有手机号
- 特征:11位数字,以1开头
- 正则:
/^1\d{10}$/
验证:reg.test(“13812345678”) → true
三、核心语法速记表
类型 | 符号 | 作用 | 示例 | 匹配结果 |
---|---|---|---|---|
精确匹配 | ^…$ | 完全匹配 | ^ok$ | “ok” ✔️ “ok?” ❌ |
数字 | \d | 匹配单个数字 | \d\d | “12”、"3a"中的"3a"❌ |
任意字符 | . | 匹配换行外的任意字符 | a.c | “abc”、“a c” ✔️ |
次数控制 | {n,m} | 出现n到m次 | \d{3,5} | “123”、“12345” ✔️ |
或运算 | […] | 匹配括号内任意一个字符 | [aeiou] | 匹配任意元音字母 |
排除 | [^…] | 不匹配括号内字符 | [^0-9] | 匹配非数字字符 |
快捷符号 | \w | 字母/数字/下划线 | \w+@\w+.com | 匹配简单邮箱格式 |
四:常见语法说明
普通字符与元字符
在正则表达式中,普通字符是字面意思的字符。例如:
- /男/:匹配“男”
- /刘德华/:匹配“刘德华”
- /abc/:匹配“abc”
与之不同的是,元字符是具有特殊含义的字符。例如: - /./:匹配任何单个字符(除了换行符)。
元字符-边界符
- /^内容/:匹配以某个内容开头的字符串。
- /内容$/:匹配以某个内容结尾的字符串。
- 精确匹配,将边界符结合使用可以实现精确匹配:
/^内容$/:匹配完全等于“内容”的字符串。
元字符 - 量词
量词用于控制字符出现的次数:
量词 | 说明 |
---|---|
*星号 | 出现0次或多次 |
+ | 出现1次或多次 |
? | 出现0次或1次 |
{n} | 出现n次 |
{n,} | 出现至少n次 |
{n,m} | 出现至少n次,最大m次 |
注意:量词只修饰它左边的字符,若要修饰整体,请用小括号包起来。
元字符 - 字符类
- | : 或,要么左边要么右边 。例:
// 代表要么a要么b要么1要么2中的任意一个
/1|a|b|2/
- [] : 匹配字符集合, 中括号里任意一个都可以
// 代表要么a要么b要么c要么1要么2要么3
[abc123]
- [-] :表示范围, [起点-终点]
[a-z] // a-z中的任意一个
[0-9] // 0-9中的任意一个
[A-Z] // A-Z中的任意一个
[a-zA-Z0-9] // 代表任意一个大小写字母或者任意一个数字
- [^] :表示非
[^0-9] // 除了0-9以外的任意一个
一定要记住:不加严格匹配代表只要有即可,加了严格匹配代表只能是某个格式
- . : 除了\r与\n以外的任意字符
- 匹配中文 /[\u4e00-\u9fa5]/
元字符 - 预定义类
- 预定义类:预定用于简化常见匹配:
符号 | 描述 |
---|---|
\d | 匹配数字 |
\D | 匹配非数字 |
\w | 匹配文本字符,也就是任意字母、数字、下划线 |
\W | 匹配非文本字符,也就是除了字母、数字、下划线 |
\s | 匹配不可见字符 |
\S | 匹配可见字符 |
正则修饰符
修饰符用于修改正则表达式的行为:
-i:忽略大小写。
- g:全局匹配。
/正则内容/修饰符
例: /[a-z]/i 忽略大小写的
-
i:忽略大小写
-
g:全局匹配
两个一起写,写成 ig 或 gi 就代表 既忽略大小写,也全局匹配 -
替换
使用 replace 方法替换字符串内容:
str.replace(正则表达式, 要替换的内容)
例:
let str = 'oooOOO哈哈哈OOOooo'
str = str.replace(/o/ig, '') // 把所有的o不区分大小写全部替换成空字符串
console.log(str) // 哈哈
正则的本质
正则表达式本质上是一个对象,可以通过字面量或构造函数创建:
- 字面量表示法:/规则/
- 构造函数:
let 对象名 = new RegExp('规则', '修饰符')
示例:
let reg = new RegExp('sb', 'ig') // 代表忽略大小写而且全局的找sb
要找字母数字下划线
字面量:/\w/
let reg2 = new RegExp('\\w', '修饰符')
- 注意:在构造函数中预定义类需要多加一个反斜杠(\),因为反斜杠在字符串中是转义符。
五、高频场景解决方案
一、校验数字的表达式
- 数字:
^[0-9]*$
- n位的数字:^\d{n}$
- 至少n位的数字:^\d{n,}$
- m-n位的数字:^\d{m,n}$
- 零和非零开头的数字:^(0|[1-9][0-9]*)$
- 非零开头的最多带两位小数的数字:^([1-9][0-9]*)+(.[0-9]{1,2})?$
- 带1-2位小数的正数或负数:^(-)?\d+(.\d{1,2})$
- 正数、负数、和小数:^(-|+)?\d+(.\d+)?$
- 有两位小数的正实数:
^[0-9]+(\.[0-9]{2})?$
- 有1~3位小数的正实数:
^[0-9]+(\.[0-9]{1,3})?$
- 非零的正整数:
^[1-9]\d*$ 或 ^([1-9][0-9]*){1,3}$ 或 ^\+?[1-9][0-9]*$
- 非零的负整数:
^\-[1-9][]0-9"*$ 或 ^-[1-9]\d*$
- 非负整数:
^\d+$ 或 ^[1-9]\d*|0$
- 非正整数:
^-[1-9]\d*|0$ 或 ^((-\d+)|(0+))$
- 非负浮点数:
^\d+(\.\d+)?$ 或 ^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$
- 非正浮点数:
^((-\d+(\.\d+)?)|(0+(\.0+)?))$ 或 ^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$
- 正浮点数:
^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$ 或 ^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$
- 负浮点数:
^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$ 或 ^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$
- 浮点数:
^(-?\d+)(\.\d+)?$ 或 ^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$
二、校验字符的表达式
- 汉字:
^[\u4e00-\u9fa5]{0,}$
- 英文和数字:
^[A-Za-z0-9]+$ 或 ^[A-Za-z0-9]{4,40}$
- 长度为3-20的所有字符:^.{3,20}$
- 由26个英文字母组成的字符串:
^[A-Za-z]+$
- 由26个大写英文字母组成的字符串:
^[A-Z]+$
- 由26个小写英文字母组成的字符串:
^[a-z]+$
- 由数字和26个英文字母组成的字符串:
^[A-Za-z0-9]+$
- 由数字、26个英文字母或者下划线组成的字符串:
^\w+$ 或 ^\w{3,20}$
- 中文、英文、数字包括下划线:
^[\u4E00-\u9FA5A-Za-z0-9_]+$
- 中文、英文、数字但不包括下划线等符号:
^[\u4E00-\u9FA5A-Za-z0-9]+$ 或 ^[\u4E00-\u9FA5A-Za-z0-9]{2,20}$
- 可以输入含有
^%&',;=?$\"
等字符:[^%&',;=?$\x22]+
- 禁止输入含有~的字符:
[^~\x22]+
三、特殊需求表达式
- Email地址:
^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$
- 域名:
[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+\.?
- InternetURL:
[a-zA-z]+://[^\s]* 或 ^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$
- 手机号码:
^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$
- 电话号码(“XXX-XXXXXXX”、“XXXX-XXXXXXXX”、“XXX-XXXXXXX”、“XXX-XXXXXXXX”、"XXXXXXX"和"XXXXXXXX):
^(\(\d{3,4}-)|\d{3.4}-)?\d{7,8}$
- 国内电话号码(0511-4405222、021-87888822):\d{3}-\d{8}|\d{4}-\d{7}
- 电话号码正则表达式(支持手机号码,3-4位区号,7-8位直播号码,1-4位分机号):
((\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$)
- 身份证号(15位、18位数字),最后一位是校验位,可能为数字或字符X:
(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)
- 帐号是否合法(字母开头,允许5-16字节,允许字母数字下划线):
^[a-zA-Z][a-zA-Z0-9_]{4,15}$
- 密码(以字母开头,长度在6~18之间,只能包含字母、数字和下划线):
^[a-zA-Z]\w{5,17}$
- 强密码(必须包含大小写字母和数字的组合,不能使用特殊字符,长度在 8-10 之间):^
(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z0-9]{8,10}$
- 强密码(必须包含大小写字母和数字的组合,不能使用特殊字符,长度在 8-10 之间):^
- 强密码(必须包含大小写字母和数字的组合,可以使用特殊字符,长度在8-10之间):
^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$
- 日期格式:
^\d{4}-\d{1,2}-\d{1,2}
- 一年的12个月(01~09和1~12):
^(0?[1-9]|1[0-2])$
- 一个月的31天(01~09和1~31):
^((0?[1-9])|((1|2)[0-9])|30|31)$
- 一年的12个月(01~09和1~12):
- 钱的输入格式:
- a.有四种钱的表示形式我们可以接受:“10000.00” 和 “10,000.00”, 和没有 “分” 的 “10000” 和 “10,000”:
^[1-9][0-9]*$
- c.这表示任意一个不以0开头的数字,但是,这也意味着一个字符"0"不通过,所以我们采用下面的形式:
^(0|[1-9][0-9]*)$
- 一个0或者一个不以0开头的数字.我们还可以允许开头有一个负号:
^(0|-?[1-9][0-9]*)$
- 这表示一个0或者一个可能为负的开头不为0的数字,让用户以0开头好了,把负号的也去掉,因为钱总不能是负的吧。下面我们要加的是说明可能的小数部分:
^[0-9]+(.[0-9]+)?$
- 必须说明的是,小数点后面至少应该有1位数,所以"10."是不通过的,但是 “10” 和 “10.2” 是通过的:
^[0-9]+(.[0-9]{2})?$
- 这样我们规定小数点后面必须有两位,如果你认为太苛刻了,可以这样:
^[0-9]+(.[0-9]{1,2})?$
- 这样就允许用户只写一位小数,下面我们该考虑数字中的逗号了,我们可以这样:
^[0-9]{1,3}(,[0-9]{3})*(.[0-9]{1,2})?$
- 1到3个数字,后面跟着任意个 逗号+3个数字,逗号成为可选,而不是必须:
^([0-9]+|[0-9]{1,3}(,[0-9]{3})*)(.[0-9]{1,2})?$
q.备注:这就是最终结果了,别忘了"+“可以用”*"替代如果你觉得空字符串也可以接受的话(奇怪,为什么?)最后,别忘了在用函数时去掉去掉那个反斜杠,一般的错误都在这里
- a.有四种钱的表示形式我们可以接受:“10000.00” 和 “10,000.00”, 和没有 “分” 的 “10000” 和 “10,000”:
- xml文件:
^([a-zA-Z]+-?)+[a-zA-Z0-9]+\\.[x|X][m|M][l|L]$
- 中文字符的正则表达式:
[\u4e00-\u9fa5]
- 双字节字符:
[^\x00-\xff]
(包括汉字在内,可以用来计算字符串的长度(一个双字节字符长度计2,ASCII字符计1)) - 空白行的正则表达式:
\n\s*\r
(可以用来删除空白行) - HTML标记的正则表达式:<(\S*?)[^>]>.?|<.? /> ( 首尾空白字符的正则表达式:
^\s*|\s*$或(^\s*)|
(\s$) (可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等),非常有用的表达式) - 腾讯QQ号:
[1-9][0-9]{4,}
(腾讯QQ号从10000开始) - 中国邮政编码:
[1-9]\d{5}(?!\d)
(中国邮政编码为6位数字) - IPv4地址:
((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}
六、避坑指南
- 贪婪匹配陷阱
"a<b>test</b>c".match(/<.*>/); // 匹配整个"<b>test</b>"
解决方案:用非贪婪模式
"a<b>test</b>c".match(/<.*?>/); // 匹配"<b>"和"</b>"
- 转义符使用
// 错误:匹配"."本身
/./.test("a"); // true(错误匹配任意字符)
// 正确:使用转义
/\./.test("a.txt"); // true
- 全局匹配重置
const reg = /a/g;
reg.test("a"); // true
reg.test("a"); // false(需要重置lastIndex)
reg.lastIndex = 0;
七、可视化工具推荐
RegExr:实时高亮匹配结果
Regex101:详细错误解释
Regulex:生成正则表达式流程图
八、练习场(答案见文末)
- 匹配身份证号(18位,末位可能是X)
- 提取HTML中的所有链接(href属性值)
- 将日期格式从"2023-09-15"改为"15/09/2023"
答案:
/^\d{17}[\dXx]$/
/href="(.*?)"/g
str.replace(/(\d{4})-(\d{2})-(\d{2})/, "$3/$2/$1")