优秀文章:mp.weixin.qq.com/s/40UCh57rB…
一、创建方式
方式1
let reg1 = /ABC\-250/
方式2
通过new RegExp('正则表达式')创建一个RegExp对象
const reg2 = new RegExp('ABC\\-250');
console.log(reg2)// /ABC\-001/
二、正则表达式标识
g 全局搜索。(匹配多次)
i 大小写不敏感(忽略字符大小写)
m 多行搜索(^和$能匹配行结束符)
s 允许 `.` 匹配换行符。
u 使用 unicode 码的模式进行匹配。
y 执行“粘性 (`sticky`)”搜索,匹配从目标字符串的当前位置开始。
三、正则表达式字符
\d 等同于[0-9],匹配一个数字
\D 等同于[^0-9],匹配一个非数字字符
\f 匹配一个换页符 (U+000C)。
\n 匹配一个换行符 (U+000A)。
\r 匹配一个回车符 (U+000D)。
\s 匹配一个空白字符,包括空格、制表符、换页符和换行符。
\S 匹配一个非空白字符。
\w 匹配一个单字字符(字母、数字或者下划线)。等价于 `[A-Za-z0-9_]`。
\W 匹配一个非单字字符。等价于 `[^A-Za-z0-9_]`。
. 可以匹配任意字符
* 表示任意个字符(包括0个)
+ 表示至少一个字符
?表示0个或1个字符 等价于 `{0,1}`
{n} 表示n个字符 如: \d{2}表示匹配2个数字,例如`25`
{n,m} 表示n-m个字符
^ 表示行的开头,^\d 表示必须以数字开头
& 表示行的结束,\d$ 表示必须以数字结束
\ 反斜杠 用来转义特殊字符
. (小数点)默认匹配除换行符之外的任何单个字符。
?
匹配前面一个表达式 0 次或者 1 次。等价于 `{0,1}`。
例如,`/e?le?/` 匹配 "angel" 中的 'el'、"angle" 中的 'le' 以及 "oslo' 中的 'l'。
如果**紧跟在任何量词 *、 +、? 或 {} 的后面**,将会使量词变为**非贪婪**(匹配尽量少的字符),和缺省使用的**贪婪模式**(匹配尽可能多的字符)正好相反。例如,对 "123abc" 使用 `/\d+/` 将会匹配 "123",而使用 `/\d+?/` 则只会匹配到 "1"。
还用于先行断言中,如本表的 `x(?=y)` 和 `x(?!y)` 条目所述。
\s
匹配一个空白字符,包括空格、制表符、换页符和换行符。等价于 [ \f\n\r\t\v\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]。
例如,`/\s\w*/` 匹配"foo bar."中的' bar'。
经测试,\s不匹配"[\u180e](https://unicode-table.com/cn/180E/)",在当前版本 Chrome(v80.0.3987.122) 和 Firefox(76.0.1) 控制台输入/\s/.test("\u180e") 均返回 false。
\S
匹配一个非空白字符。等价于 `[^ `\f\n\r\t\v\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff`]`。
例如,`/\S\w*/` 匹配"foo bar."中的'foo'。
实例:
const my_regexp =/\d{3}\s+\d{3,8}/ 从左到右解读:
1.\d{3}表示匹配3个数字,例如'010';
2.\s可以匹配一个空格(也包括Tab等空白符),所以\s+表示至少有一个空格,例如匹配' ','\t\t'等;
3.\d{3,8}表示3-8个数字,例如'1234567'。
[]表示范围 [0-9a-zA-Z\_] 可以匹配一个数字、字母或者下划线;
[0-9a-zA-Z\_]+ 可以匹配至少由一个数字、字母或者下划线组成的字符串,比如'a100','0_Z','js2015'等等;
[a-zA-Z\_\$][0-9a-zA-Z\_\$]* 可以匹配由字母或下划线、$开头,后接任意个由一个数字、字母或者下划线、$组成的字符串,也就是JavaScript允许的变量名;
[a-zA-Z\_\$][0-9a-zA-Z\_\$]{0, 19} 更精确地限制了变量的长度是1-20个字符(前面1个字符+后面最多19个字符)。
四 、实例方法
1、test() 方法用于检测给定的字符串是否符合条件(不能对这个方法使用g标识符)
var reg = /^\d{3}\-\d{2,5}$/
reg.test('111-222') // true
reg.test('111-123x') // false
reg.test('111 12345')// false
2、exec() 方法在匹配成功后,会返回一个Array,第一个元素是正则表达式匹配到的整个字符串,后面的字符串标识匹配成功的子串,若匹配失败返回null
ps:
var reg = /^(\d{3})-(\d{2,5})$/;
reg.exec('111-123'); //['111-123','111','123']
reg.exec('222 333'); // null
五、正则替换 replace
replace() 方法可以实现替换字符串操作,用来替换的参数可以是一个字符串或是一个正 则表达式。
案例:过滤敏感词汇
<textarea name="" id="message"></textarea> <button>提交</button>
<div></div>
<script>
var text = document.querySelector('textarea');
var btn = document.querySelector('button');
var div = document.querySelector('div');
btn.onclick = function() {
div.innerHTML = text.value.replace(/激情|gay/g, '**');
}
</script>
常用正则手册
1、中国手机号
1、中国手机号(严谨), 根据工信部2019年最新公布的手机号段 /^((\+|00)86)?1((3[\d])|(4[5,6,7,9])|(5[0-3,5-9])|(6[5-7])|(7[0-8])|(8[\d])|(9[1,8,9]))\d{8}$/
2、中国手机号(宽松), 只要是13,14,15,16,17,18,19开头即可 /^((\+|00)86)?1[3-9]\d{9}$/
3、中国手机号(最宽松), 只要是1开头即可, 如果你的手机号是用来接收短信, 优先建议选择这一条 /^((\+|00)86)?1\d{10}$/
2、国内座机电话,如:0341-86091234
/\d{3}-\d{8}|\d{4}-\d{7}/
3、邮箱地址
/^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
4、银行卡号
/^([1-9]{1})(\d{15}|\d{18})$/
5、身份证号
1、一代身份证号(15位数字) /^\d{8}(0\d|10|11|12)([0-2]\d|30|31)\d{3}$/
2、二代身份证号(18位数字),最后一位是校验位,可能为数字或字符X /^\d{6}(18|19|20)\d{2}(0\d|10|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$/
3、身份证号, 支持1/2代(15位/18位数字) /(^\d{8}(0\d|10|11|12)([0-2]\d|30|31)\d{3}$)|(^\d{6}(18|19|20)\d{2}(0\d|10|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$)/
6、护照(包含香港、澳门)
/(^[EeKkGgDdSsPpHh]\d{8}$)|(^(([Ee][a-fA-F])|([DdSsPp][Ee])|([Kk][Jj])|([Mm][Aa])|(1[45]))\d{7}$)/
7、网址
/^((https?|ftp):\/\/)?([\da-z.-]+)\.([a-z.]{2,6})(\/\w\.-]*)*\/?/
8、是否QQ号格式正确
/^[1-9][0-9]{4,10}$/
9、中文姓名
/^([\u4e00-\u9fa5·]{2,16})$/
10、英文姓名
/(^[a-zA-Z]{1}[a-zA-Z\s]{0,20}[a-zA-Z]{1}$)/
11、是否由数字和字母组成
/^[A-Za-z0-9]+$/
12、纯英文字母
/^[a-zA-Z]+$/
纯小写英文字母组成
/^[a-z]+$/
纯大写英文字母
/^[A-Z]+$/
13、纯中文/汉字
/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0])+$/
14、纯数字
/^\d{1,}$/
16、只包含中文和数字
/^((?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0])|(\d))+$/
17、不能包含字母
/^[^A-Za-z]*$/
18、16进制颜色
/^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/
17、密码验证
强:最少6位,包括至少1个大写字母,1个小写字母,1个数字,1个特殊字符
/^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/
中:字母+数字,字母+特殊字符,数字+特殊字符
/^(?![a-zA-z]+$)(?!\d+$)(?![!@#$%^&*]+$)[a-zA-Z\d!@#$%^&*]+$/
弱:纯数字,纯字母,纯特殊字符
/^(?:\d+|[a-zA-Z]+|[!@#$%^&*]+)$/
18、用户名正则,4到16位(字母,数字,下划线,减号,括号)
/^[a-zA-Z0-9_-\()]{4,16}$/
19、微信号,6至20位,以字母开头,字母,数字,减号,下划线
var wxPattern = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/;
//输出 true
console.log(wxPattern.test("RuilongMao"));
20、日期
var dP2 = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
//输出 true
console.log(dP2.test("2017-02-11"));
//输出 false
console.log(dP2.test("2017-15-11"));
21、用户名
//用户名正则,4到16位(字母,数字,下划线,减号)
var uPattern = /^[a-zA-Z0-9_-]{4,16}$/;
//输出 true
console.log(uPattern.test("iFat3"));
输入框只能输入中文英文和空格
const reg = /^[a-zA-Z\u4e00-\u9fa5\s]+$/
<Form.Item name="contentFirst"
label="文本区域"
rules={[ { required: true },
{ validator: (rule, value, cbk) => {
if (!reg.test(value)) {
return cbk('不能输入数字和其他特殊符号') }
cbk() },
}, ]} >
<Input allowClear maxLength={20} onChange={handleContentFirst} style={{ width: '100%' }} />
</Form.Item>
利用正则实现如下效果
'2022-06-01' ====> '01/06/2022'
'2022-06-01'.replace(/(\d{4})-(\d{2})-(\d{2})/,'$2/$3/$1')
输出:'01/06/2022'
号码加密 135*****1245
phoneFilter(val) {
if (val) {
// const reg = /^(\d{3}).*(\d{4})$/;
const reg = /^(.{3}).*(.{4})$/;
return val.replace(reg, '$1****$2');
}
}
22、去除空格
1.去除左空格,str1是处理后的
let str1 = str.replace(/(^\s*)/g,"")
2.去除右空格,str2是处理后的
let str2 = str.replace(/(\s*$)/g,"")
3.去除左右空格
let str3 = str.replace(/(^\s*)|(\s*$)/g,"")
4.'2022-06-13' ====>'06/13/2022'
'2022-06-13'.replace(/(\d{4})-(\d{2})-(\d{2})/,'$2/$3/$1')----> "06/13/2022"