javascript正则表达式
一:正则常用元字符和特殊字符
字符 | 功能说明 |
[ ] | 用来限制输入内容,与[ ]中的字符相匹配 |
[ ^ ] | 不与[]内的相匹配 |
[a-z] | 与a-z的任意字符相匹配 |
[^a-z] | 不与a-z的任意字符相匹配 |
{} |
用来限制输入的字符数量. 比如 : [0-9]{3},表示可输入3个数字 |
{m,n} |
表示最少输入m个,最多输入n个。这里n可以不填,表示无限制 比如:[0-9]{3,6},表示最少输入3个数字,最多输入6个数字 [0-9]{3,},表示最少输入3个数字,最多没限制 |
| | 或运算符 |
( ) | 用来匹配()内的验证规则 |
? |
表示可出现0次或者1次. 比如:A ?,表示A可以出现1次或者不出现 |
+ | 表示可出现1次或1次以上,可以理解成有此符号的限制必须出现,一次或多次 |
* | 表示可出现0次或0次以上,可以理解成可有可无 |
\d | 匹配任意一个数字,同[0 - 9] |
\d+ | 同[0 - 9]+ |
\D | 同[ ^ 0 - 9] ,可以理解为大写就是取反 |
\D+ | 同[ ^ 0 - 9]+ |
\w | 匹配任意一个数字或者英文字母,[a-zA-Z0-9] |
\w+ | 同[a-zA-Z0-9]+ |
\W | 同[^a-zA-Z0-9] |
\W+ | 同[^a-zA-Z0-9]+ |
\s | 匹配任意不可见字符, 包括空格、制表符、换行符等 |
\S | 匹配任意可见字符 |
\n |
匹配换行 |
. |
匹配除换行符以外的任意字符 |
\ | 表示显示特殊字符,如\?{3},表示要输入3个? |
^ | 匹配字符串开头 |
$ | 匹配字符串结尾 |
常用的差不多就这些了,有不足后期会在补充。
二:RegExp构造函数和字符串使用正则的一些方法
1:RegExp
test方法:用于测试给定的字符串是否符合条件。
var re = /^\d{3}\-\d{3,8}$/; re.test('010-12345'); // true re.test('010-1234x'); // false re.test('010 12345'); // false
2:字符串使用正则
- match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配
let str="123string啊啊啊" str.match(/\d+/g)
结果:["123"]
- replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
stringObject.replace(regexp/substr,replacement)
语法说明:
参数 描述 regexp/substr: 必需。规定子字符串或要替换的模式的 RegExp 对象。 请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象。 replacement: 必需。一个字符串值。规定了替换文本或生成替换文本的函数。
repla7ement 可以是字符串,也可以是函数。如果它是字符串,那么每个匹配都将由字符串替换。但是 replacement 中的 $ 字符具有特定的含义。如下所示,它说明从模式匹配得到的字符串将用于替换。
$0 $1、$2、...、$99 | 与 regexp 中的第 1 到第 99 个子表达式相匹配的文本。 |
$& | 与 regexp 相匹配的子串。 |
$` | 位于匹配子串左侧的文本。 |
$' | 位于匹配子串右侧的文本。 |
$$ | 直接量符号。 |
下面举几个replace() 方法常用的例子:
第一种情况:方法的两个参数都是字符串
这个时候会直接替换掉要替换的部分,下面是代码:
var str1 = '这是一段原始文本,需要替换的内容"这要替换"!'; var newStr = str1.replace('这要替换','替换完成'); console.log( newStr ); //输出: 这是一段原始文本,需要替换的内容"替换完成"!
第二种情况:第一个参数是正则,第二个参数是字符串
这个时候会根据正则去替换内容,下面是代码:
var str2 = '这是一段原始文本,需要替换的内容"111111"!'; var newStr = str2.replace( /([0-9])+/g,'替换完成' ); console.log( newStr ); //输出: 这是一段原始文本,需要替换的内容"替换完成"!
第三种情况:第一个参数是正则,第二个参数是带$符的字符串
$代表什么可以看上面的语法说明,下面是代码:
var str3 = '这是一段原始文本,"3c这要替换4d"!'; var newStr = str3.replace( /([0-9])([a-z])/g,"$1" ); console.log( newStr ); //输出: 这是一段原始文本,"3这要替换4"!';
这里要解释一下,因为这个不太好懂。$是与子表达事相匹配,什么叫与子表达式相匹配?来看上面的例子[0-9],[a-z]都是子表达式,$1就是第一个子表达式,$2就是第二个子表达式。现在来说一下为什么会替换成上面那样,首先方法会匹配到 ‘ 3c ’这个字符串,而这个时候$1匹配到的是 ‘ 3 ’,所以3c就会被替换成3,然后是匹配到‘ 4d ’,这个时候子表达式匹配到的是什么?上面不是说是‘ 3 ’了吗,并不是,是’ 4 ‘。前面的正则每匹配到一串字符串,他的子表达式都会重新匹配一次,匹配的结果就是这次匹配到的字符串的子级。
可以这样理解,就是后面的子表达式会在前面的父表达式身上进行匹配,就比如第一次匹配到的是‘ 3c ’,那我后面的子表达式就在这个‘ 3c ’身上去匹配,因为每次前面表达式匹配到的值都在变化,所以子表达式所匹配到的值也会一直变化。(我是这样理解的,感觉不对的同仁可以指出错误)
第四种情况:第一个参数是正则,第二个参数函数
说一个我在工作中遇到的问题,现在我有个需求,匹配一串字符串中的所有数字让他高亮显示。刚拿到这个问题一定有点懵,这怎么处理?
其实仔细一想其实很简单,只要在字符串里的数字外面都给他包一层html元素,比如span,在给这个sapn加样式不就可以了。这里就用到了第四种情况。下面上代码:
let reg = /([0-9|'微信'|'手机'])/ var aaa = text.replace(new RegExp(reg, 'g'), function($0, $1){ return '<span>' + $0 + '</span>'; });
好了,以上四种情况虽然并不是replace() 方法的所有用法,但我觉得差不多够用了。
三:常用正则表达式
//身份证验证 pattern: /(^[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]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/ //只输入中文 pattern: /^[\u4e00-\u9fa5]+$/ //手机号正确验证 pattern: /^1[3456789]\d{9}$/ //邮箱验证 pattern: ^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$ /^\w+@\w+(\.[a-zA-Z]{2,3}){1,2}$/ //密码验证 pattern: /^[a-zA-Z0-9]{4,10}$/ //只能输入英文 oninput="value=value.replace(/[^\d]/g,'')" //--------------------------------------------------------------------->