简写形式
\d就是[0-9]。表示是一位数字。记忆方式:其英文是digit(数字)D就是[^0-9]。表示除数字外的任意字符\w就是[0-9a-zA-Z_]。表示数字、大小写字母和下划线。记忆方式:w是word的简写,也称单词字符。W是[^0-9a-zA-Z_]。非单词字符\s是[ \t\v\n\r\f]。表示空白符,包括空格、水平制表符、垂直制表符、换行符、回车符、换页符。记忆方式:s是space character的首字母\S是[^ \t\v\n\r\f]。 非空白符.就是[^\n\r\u2028\u2029]。通配符,表示几乎任意字符。换行符、回车符、行分隔符和段分隔符除外。记忆方式:想想省略号...中的每个点,都可以理解成占位符,表示任何类似的东西
如果要匹配任意字符怎么办?可以使用
[\d\D]、[\w\W]、[\s\S]和[^]中任何的一个
修饰符
g全局匹配,即找到所有匹配的,单词是globali忽略字母大小写,单词ingoreCasem多行匹配,只影响^和$,二者变成行的概念,即行开头和行结尾。单词是multiline
量词
{m,}表示至少出现m次{m}等价于{m,m},表示出现m次?等价于{0,1},表示出现或者不出现。记忆方式:问号的意思表示,有吗?+等价于{1,},表示出现至少一次。记忆方式:加号是追加的意思,得先有一个,然后才考虑追加*等价于{0,},表示出现任意次,有可能不出现。记忆方式:看看天上的星星,可能一颗没有,可能零散有几颗,可能数也数不过来
贪婪匹配
var reg= /\d{2,5}/g;
var string = "123 1234 12345 123456";
console.log( string.match(reg) );
// => ["123", "1234", "12345", "12345"]
懒惰匹配
var reg = /\d{2,5}?/g;
var string = "123 1234 12345 123456";
console.log( string.match(reg) );
// => ["12", "12", "34", "12", "34", "12", "34", "56"]
其中
/\d{2,5}?/表示匹配2-5次都行,当匹配到2个的时候,就不再下匹配了
以下都是懒惰匹配:
{m,n}? {m,}? ?? +? *?
多选分支
var reg = /hi|hi123/g;
var string = "hi123";
console.log( string.match(reg) );
// => [ 'hi' ]
如果正则改成
/hi123|hi/g,则匹配结果为[ 'hi123' ]可以看出多选分支也是懒惰匹配,要注意这一点
字符匹配
精确匹配
var reg = /hello/;
console.log(reg.test("hello")); // => true
横向模糊匹配
var reg = /ab{2,5}cd/g;
var string = "abcd abbcd abbbbbcd abbbbbbcd";
console.log(string.match(reg));
// => [ 'abbcd', 'abbbbbcd' ]
纵向模糊匹配
var reg = /a[12]b/g;
var string = "a0b a1b a2b a3b";
console.log(string.match(reg));
// => [ 'a1b', 'a2b' ]
范围表示法
如果要查找的字符串比较多,可以使用范围表示法
- 比如
[123456abcdefGHIJKLM],可以写成[1-6a-fG-M] - 匹配“
a”、“-”、“z”这三者中任意一个字符,可以使用[-az]或[az-]或[a-z]
排除法
[^abc],表示除"a"、"b"、"c"之外的任意一个字符,字符组的第一位放^(脱字符),表示求反的概念
匹配规则
常见的校验规则如下:
| 规则 | 描述 |
|---|---|
| \ | 转义 |
| ^ | 匹配输入的开始 |
| $ | 匹配输入的结束 |
| * | 匹配前一个表达式 0 次或多次 |
| + | 匹配前面一个表达式 1 次或者多次。等价于 {1,} |
| ? | 匹配前面一个表达式 0 次或者 1 次。等价于{0,1} |
| . | 默认匹配除换行符之外的任何单个字符 |
| x(?=y) | 匹配'x'仅仅当'x'后面跟着'y'。这种叫做先行断言 |
| (?<=y)x | 匹配'x'仅当'x'前面是'y'.这种叫做后行断言 |
| x(?!y) | 仅仅当'x'后面不跟着'y'时匹配'x',这被称为正向否定查找 |
| (?<!y)x | 仅仅当'x'前面不是'y'时匹配'x',这被称为反向否定查找 |
| x|y | 匹配‘x’或者‘y’ |
| {n} | n 是一个正整数,匹配了前面一个字符刚好出现了 n 次 |
| {n,} | n是一个正整数,匹配前一个字符至少出现了n次 |
| {n,m} | n 和 m 都是整数。匹配前面的字符至少n次,最多m次 |
| [xyz] | 一个字符集合。匹配方括号中的任意字符 |
| [^xyz] | 匹配任何没有包含在方括号中的字符 |
| \b | 匹配一个词的边界,例如在字母和空格之间 |
| \B | 匹配一个非单词边界 |
| \d | 匹配一个数字 |
| \D | 匹配一个非数字字符 |
| \f | 匹配一个换页符 |
| \n | 匹配一个换行符 |
| \r | 匹配一个回车符 |
| \s | 匹配一个空白字符,包括空格、制表符、换页符和换行符 |
| \S | 匹配一个非空白字符 |
| \w | 匹配一个单字字符(字母、数字或者下划线) |
| \W | 匹配一个非单字字符 |
正则表达式标记
| 标志 | 描述 |
|---|---|
g | 全局搜索。 |
i | 不区分大小写搜索。 |
m | 多行搜索。 |
s | 允许 . 匹配换行符。 |
u | 使用unicode码的模式进行匹配。 |
y | 执行“粘性(sticky)”搜索,匹配从目标字符串的当前位置开始。 |
匹配方法
正则表达式常被用于某些方法,我们可以分成两类:
- 字符串(str)方法:
match、matchAll、search、replace、split - 正则对象下(regexp)的方法:
test、exec
| 方法 | 描述 |
|---|---|
| exec | 一个在字符串中执行查找匹配的RegExp方法,它返回一个数组(未匹配到则返回 null)。 |
| test | 一个在字符串中测试是否匹配的RegExp方法,它返回 true 或 false。 |
| match | 一个在字符串中执行查找匹配的String方法,它返回一个数组,在未匹配到时会返回 null。 |
| matchAll | 一个在字符串中执行查找所有匹配的String方法,它返回一个迭代器(iterator)。 |
| search | 一个在字符串中测试匹配的String方法,它返回匹配到的位置索引,或者在失败时返回-1。 |
| replace | 一个在字符串中执行查找匹配的String方法,并且使用替换字符串替换掉匹配到的子字符串。 |
| split | 一个使用正则表达式或者一个固定字符串分隔一个字符串,并将分隔后的子字符串存储到数组中的 String 方法。 |
常用正则表达式
// 整数
export const integerReg = /^[-+]?\d*$/;
// 最多两位小数
export const float2 = /^\d+(\.\d{1,2})?$/;
// 手机号码
export const phoneReg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
// 身份证
export const sfzReg =
/^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
// 邮箱
export const emailReg =
/^([A-Za-z0-9_\-.])+@([A-Za-z0-9_\-.])+\.([A-Za-z]{2,4})$/;
// URL
export const urlReg =
/^((https?|ftp|file):\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([/\w .-]*)*\/?$/;
// ipv4
export const ipv4Reg =
/^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
// 16进制颜色
export const color16Reg = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/;
// 日期YYYY-MM-DD
export const dateReg = /^\d{4}(-)\d{1,2}\1\d{1,2}$/;
// 日期 YYYY-MM-DD hh:mm:ss
export const dateRegS =
/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})$/;
// 邮政编号的校验
export const postalNoReg = /^\d{6}$/;
// QQ号的校验
export const qqReg = /^[1-9][0-9]{4,10}$/;
// 微信号的校验
export const wxReg = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/;
// 车牌号的校验
export const carNoReg =
/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
// 只含字母的字符串
export const letterReg = /^[a-zA-Z]+$/;
// 包含中文的字符串
export const cnReg = /[\u4E00-\u9FA5]/;
// 密码强度的校验
export const passwordReg = /(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{4,20}/;
export const psReg =
/^(?=.*?[a-z])(?=.*?[A-Z])(?=.*?\d)(?=.*?[!#@*&.])[a-zA-Z\d!#@*&.]{4,20}$/;
// 字符串长度n的校验
export const checkStrLength = (n: number) => {
return new RegExp(`^.{${n}}$`);
};
// 文件拓展名的校验
export const checkFileName = (arr: Array<string>[]) => {
const str = arr.map((name) => `.${name}`).join('|');
return new RegExp(`(${str})$`);
};
// 匹配img和src
export const imgReg = /<img.*?src=["|']?(.*?)["|']?\s.*?>/gi;
// 匹配html中的注释
export const noteReg = /<!--(.*?)-->/g;
// 匹配html中的style
export const styleReg = /style="[^=>]*"([(\s+\w+=)|>])/g;
// 匹配html中的颜色
export const colorReg = /#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})/g;
// 匹配htmlTag(html标签)
export const endReg = /<("[^"]*"|'[^']*'|[^'">])*>/g;