分类导航

JavaScript之正则表达式学习笔记

发布时间:2019-11-07 发布网站:大佬教程
大佬教程收集整理的这篇文章主要介绍了JavaScript之正则表达式学习笔记大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

参考:

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions

https://juejin.im/post/5b6adc7ee51d4534b8587560

↑ 这个文章写得真的很好,总结一下为了加深记忆。

http://www.cnblogs.com/zxin/archive/2013/01/26/2877765.html

创建正则表达式最好通过字面量创建,把需要匹配的字符写在两条斜线中间,   reg = /.../ ,匹配选项写在后面。

元字符,元字符是在正则表达式中有特殊含义的非字母字符。

   中包含一组字符,表示可以匹配任意一个。

   表示匹配其中不包含的任意一个字符。

   匹配范围内任意一个字母

修饰符:

  : global 全文搜索,不添加,搜索到第一个停止

  : ignore case 忽略大小写,默认大小写敏感

  : multiple 多行搜索 ,检测字符串中的换行符,主要是影响字符串开始标识符^和结束标识符$的使用

  转义字符

边界字符

  匹配开头

  匹配结尾

  匹配单词边界

  非单词边界

  匹配除了回车符和换行符之外的所有字符,等价于[^\r\n]

  匹配一个数字等价于[0-9]

  匹配一个非数字字符等价于[^0-9]

  匹配一个换行符

  匹配一个回车符

  匹配一个空白字符,包括空格、制表符、换页符和换行符。

  匹配一个非空白字符。

  匹配一个单字字符(字母、数字或者下划线)。等价于[A-Za-z0-9_]

  匹配一个非单字字符。等价于[^A-Za-z0-9_]

  出现零次或一次(最多出现一次)

 出现一次或者多次(至少出现一次)

 出现零次或者多次(任意次)

 出现n次

 出现n到m次

 至少出现n次 

<p class="heading" data-id="heading-12">贪婪模式

正则表达式默认是贪婪模式,即每次匹配都尽可能的匹配多的字符,直到匹配失败为止。取消贪婪模式,在量词后面加上'?'即可。 

<p class="heading" data-id="heading-13">分组


<p class="heading" data-id="heading-13"> <span class="cnblogs_code">( ) 


<p class="heading" data-id="heading-13">不希望捕获某些分组,只需要在分组内加上'?:'就可以了。


<div class="cnblogs_code">

 reg = /(?:Byron)(\d{4})-(\d{2})-(\d{2})/ text = 'Byron2016-12-05'
 result = text.replace(reg,'$2/$3/$1'

<p class="heading" data-id="heading-13">或


<p class="heading" data-id="heading-13"> <span class="cnblogs_code"> |  


<p class="heading" data-id="heading-13">使用


<div class="cnblogs_code">

/abc|def/.test('abc'/abc|def/.test('def'/ab(c|d)ef/.test('abcef'/ab(c|d)ef/.test('abdef')

反向引用

表达式在匹配时,表达式引擎会将小括号 "( )" 包含的表达式所匹配到的字符串记录(分组捕获)下来。在获取匹配结果的时候,小括号包含的表达式所匹配到的字符串可以单独获取。

在js中正则匹配成功的字符串可以用$1表示第一次匹配成功,$3表示第三次匹配成功的字符,以此类推至$99

reg = /(\d{4})-(\d{2})-(\d{2})/ text = '2015-12-25' result = text.replace(reg,'$2/$3/$1'

不希望捕获某些分组,只需要在分组内加上'?:'就可以了。

reg = /(?:Byron)(\d{4})-(\d{2})-(\d{2})/ text = 'Byron2016-12-05' result = text.replace(reg,'$2/$3/$1'

正向肯定查找:  

匹配'x'仅仅当'x'后面跟着'y'.这种叫做正向肯定查找。

例如,/Jack(?=Sprat)/会匹配到'Jack'仅仅当它后面跟着'Sprat'。/Jack(?=Sprat|Frost)/匹配‘Jack’仅仅当它后面跟着'Sprat'或者是‘Frost’。但是‘Sprat’和‘Frost’都不是匹配结果的一部分。

正向否定查找   

匹配'x'仅仅当'x'后面不跟着'y',这个叫做正向否定查找。

例如,/\d+(?!\.)/匹配一个数字仅仅当这个数字后面没有跟小数点的时候。正则表达式/\d+(?!\.)/.exec("3.141")匹配‘141’但是不是‘3.141’

属性

golbal: 是否全文搜索,默认false

ignoreCase: 是否大小写敏感,默认false

multiline: 多行搜索,默认false

lastIndex: 是当前表达式匹配内容的最后一个字符的下一个位置

source: 正则表达式的文本字符串

lastIndex 只有在全局匹配时生效,否则始终为0,表示上一次匹配到了字符串什么位置。下一次将在lastIndex处开始匹配。

reg = /ab/'abababab') reg.lastIndex reg.test('abcdefg')

lastIndex是循环的,当匹配不到时,就重新变为0

reg = /ab/'abab') reg.lastIndex reg.test('abab') reg.lastIndex reg.test('abab') reg.lastIndex

方法

test() ... 就不解释了 常用 上面有例子

exec()

未找到返回null

找到返回数组result,数组有两个属性

result.index: 声明匹配文本的第一个字符的位置

result.input: 存放被检索的字符串 String

result[0] 匹配的字符串

result[1]..result[n]... 表示匹配的分组,() 包起来的部分

lastIndex的变化同test

<p class="heading" data-id="heading-23">支持正则表达式的 String 对象的方法


<p data-id="heading-24">search() 这个常用 不用说,它总是忽略g


<p data-id="heading-24">match() 如果是非全局调用,返回结果和exec一样格式……如果是全局调用,就返回所有匹配项,没有其他信息。


<p data-id="heading-24">split()


<p class="heading" data-id="heading-27">replace()


<div class="cnblogs_code">

String.prototype.replace(reg,<span style="color: #0000ff;">function);中 <span style="color: #0000ff;">function 的参数含义,<span style="color: #0000ff;">function<span style="color: #000000;"> 会在每次匹配替换的时候调用,有四个参数(第二个参数不固定):

匹配字符串
正则表达式的分组内容,没有分组则没有该参数、
匹配项在字符串中的 index
原字符串

<span style="color: #0000ff;">var str = 'a1b2c3d4e5'<span style="color: #000000;">;
<span style="color: #0000ff;">var reg = /\d/<span style="color: #000000;">g;
<span style="color: #0000ff;">var arr = str.replace(reg,<span style="color: #0000ff;">function<span style="color: #000000;">(match,index,origin){
console.log(index);<span style="color: #008000;">//<span style="color: #008000;"> 1 3 5 7 9
<span style="color: #0000ff;">return parseInt(match) + 1<span style="color: #000000;">;
})
console.log(arr);<span style="color: #008000;">//<span style="color: #008000;">a2b3c4d5e6 把每次匹配到的结果+1替换

<span style="color: #0000ff;">var str = 'a1b2c3d4e5'<span style="color: #000000;">;
<span style="color: #0000ff;">var reg = /(\d)(\w)(\d)/<span style="color: #000000;">g;
<span style="color: #0000ff;">var arr = str.replace(reg,group1,group2,group3,origin){
console.log(match);<span style="color: #008000;">//<span style="color: #008000;"> 1b2 3d4
<span style="color: #0000ff;">return group1 +<span style="color: #000000;"> group3;
})
console.log(arr);<span style="color: #008000;">//<span style="color: #008000;">a12c34e5 去除了每次匹配到的group2

常见正则表达式

数字:^[-]* n位的数字:^ 至少n位的数字:^ m-n位的数字:^ 零和非零开头的数字:^(|[-][-]* 非零开头的最多带两位小数的数字:^([-][-]*)+(.[-]{,})? 带1-2位小数的正数或负数:^(\-)?\d+(\.\d{,})? 正数、负数、和小数:^(\-|\+)?\d+(\.\d+)? 有两位小数的正实数:^[-]+(.[-]{})? 有1~3位小数的正实数:^[-]+(.[-]{,})? 非零的正整数:^[-]\d*$ 或 ^([-][-]*){,}$ 或 ^\+?[-][-]* 非零的负整数:^\-[-][]- 非负整数:^\d+$ 或 ^[-]\d*| 非正整数:^-[-]\d*|$ 或 ^((-\d+)|(+ 非负浮点数:^\d+(\.\d+)?$ 或 ^[-]\d*\.\d*|\.\d*[-]\d*|?\.+| 非正浮点数:^((-\d+(\.\d+)?)|(+(\.+)?))$ 或 ^(-([-]\d*\.\d*|\.\d*[-]\d*))|?\.+| 正浮点数:^[-]\d*\.\d*|\.\d*[-]\d*$ 或 ^(([-]+\.[-]*[-][-]*)|([-]*[-][-]*\.[-]+)|([-]*[-][-]* 负浮点数:^-([-]\d*\.\d*|\.\d*[-]\d*)$ 或 ^(-(([-]+\.[-]*[-][-]*)|([-]*[-][-]*\.[-]+)|([-]*[-][-]* 浮点数:^(-?\d+)(\.\d+)?$ 或 ^-?([-]\d*\.\d*|\.\d*[-]\d*|?\.+|二、校验字符的表达式
<span style="color: #800080;">1
汉字:^[\u4e00-\u9fa5]{<span style="color: #800080;">0
<span style="color: #000000;">,}$
<span style="color: #800080;">2
英文和数字:^[A-Za-z0-<span style="color: #800080;">9
]+$ 或 ^[A-Za-z0-<span style="color: #800080;">9
]{<span style="color: #800080;">4
,<span style="color: #800080;">40
<span style="color: #000000;">}$
<span style="color: #800080;">3
长度为3-20的所有字符:^.{<span style="color: #800080;">3
,<span style="color: #800080;">20
<span style="color: #000000;">}$
<span style="color: #800080;">4
由26个英文字母组成的字符串:^[A-Za-z]+<span style="color: #000000;">$
<span style="color: #800080;">5
由26个大写英文字母组成的字符串:^[A-Z]+<span style="color: #000000;">$
<span style="color: #800080;">6
由26个小写英文字母组成的字符串:^[a-z]+<span style="color: #000000;">$
<span style="color: #800080;">7
由数字和26个英文字母组成的字符串:^[A-Za-z0-<span style="color: #800080;">9
]+<span style="color: #000000;">$
<span style="color: #800080;">8
由数字、26个英文字母或者下划线组成的字符串:^\w+$ 或 ^\w{<span style="color: #800080;">3
,<span style="color: #800080;">20
<span style="color: #000000;">}$
<span style="color: #800080;">9
中文、英文、数字包括下划线:^[\u4E00-\u9FA5A-Za-z0-9_]+<span style="color: #000000;">$
<span style="color: #800080;">10
中文、英文、数字但不包括下划线等符号:^[\u4E00-\u9FA5A-Za-z0-<span style="color: #800080;">9
]+$ 或 ^[\u4E00-\u9FA5A-Za-z0-<span style="color: #800080;">9
]{<span style="color: #800080;">2
,<span style="color: #800080;">20
<span style="color: #000000;">}$
<span style="color: #800080;">11
可以输入含有^%&<span style="color: #800000;">'
<span style="color: #800000;">,;=?$\"等字符:[^%&
<span style="color: #800000;">'
,;=?$\x22]+
<span style="color: #800080;">12
禁止输入含有~的字符:[^~\x22]+<span style="color: #000000;">

三、特殊需求表达式
<span style="color: #800080;">1 Email地址:^\w+([-+.]\w+)@\w+([-.]\w+).\w+([-.]\w+)<span style="color: #000000;">$
<span style="color: #800080;">2 域名:[a-zA-Z0-<span style="color: #800080;">9][-a-zA-Z0-<span style="color: #800080;">9]{<span style="color: #800080;">0,<span style="color: #800080;">62}(/.[a-zA-Z0-<span style="color: #800080;">9][-a-zA-Z0-<span style="color: #800080;">9]{<span style="color: #800080;">0,<span style="color: #800080;">62})+/.?
<span style="color: #800080;">3 InternetURL:[a-zA-z]+:<span style="color: #008000;">//<span style="color: #008000;">[^\s]
或 ^http:<span style="color: #008000;">//<span style="color: #008000;">([\w-]+.)+[\w-]+(/[\w-./?%&=]*)?$
<span style="color: #800080;">4 手机号码:^(<span style="color: #800080;">13[<span style="color: #800080;">0-<span style="color: #800080;">9]|<span style="color: #800080;">14[<span style="color: #800080;">0-<span style="color: #800080;">9]|<span style="color: #800080;">15[<span style="color: #800080;">0-<span style="color: #800080;">9]|<span style="color: #800080;">166|<span style="color: #800080;">17[<span style="color: #800080;">0-<span style="color: #800080;">9]|<span style="color: #800080;">18[<span style="color: #800080;">0-<span style="color: #800080;">9]|<span style="color: #800080;">19[<span style="color: #800080;">8|<span style="color: #800080;">9])\d{<span style="color: #800080;">8<span style="color: #000000;">}$
<span style="color: #800080;">5 电话号码(<span style="color: #800000;">"<span style="color: #800000;">XXX-XXXXXXX<span style="color: #800000;">"、<span style="color: #800000;">"<span style="color: #800000;">XXXX-XXXXXXXX<span style="color: #800000;">"、<span style="color: #800000;">"<span style="color: #800000;">XXX-XXXXXXX<span style="color: #800000;">"、<span style="color: #800000;">"<span style="color: #800000;">XXX-XXXXXXXX<span style="color: #800000;">"、<span style="color: #800000;">"<span style="color: #800000;">XXXXXXX<span style="color: #800000;">"和<span style="color: #800000;">"<span style="color: #800000;">XXXXXXXX):^((\d{3,4}-)|\d{3.4}-)?\d{7,8}$
<span style="color: #800080;">6 国内电话号码(<span style="color: #800080;">0511-<span style="color: #800080;">4405222、<span style="color: #800080;">021-<span style="color: #800080;">87888822):\d{<span style="color: #800080;">3}-\d{<span style="color: #800080;">8}|\d{<span style="color: #800080;">4}-\d{<span style="color: #800080;">7<span style="color: #000000;">}
<span style="color: #800080;">7 18位身份证号码(数字、字母x结尾):^((\d{<span style="color: #800080;">18})|([<span style="color: #800080;">0-9x]{<span style="color: #800080;">18})|([<span style="color: #800080;">0-9X]{<span style="color: #800080;">18<span style="color: #000000;">}))$
<span style="color: #800080;">8 帐号是否合法(字母开头,允许5-16字节,允许字母数字下划线):^[a-zA-Z][a-zA-Z0-9_]{<span style="color: #800080;">4,<span style="color: #800080;">15<span style="color: #000000;">}$
<span style="color: #800080;">9 密码(以字母开头,长度在6~18之间,只能包含字母、数字和下划线):^[a-zA-Z]\w{<span style="color: #800080;">5,<span style="color: #800080;">17<span style="color: #000000;">}$
<span style="color: #800080;">10 强密码(必须包含大小写字母和数字的组合,不能使用特殊字符,长度在8-10之间):^(?=.\d)(?=.[a-z])(?=.[A-Z]).{<span style="color: #800080;">8,<span style="color: #800080;">10<span style="color: #000000;">}$
<span style="color: #800080;">11 日期格式:^\d{<span style="color: #800080;">4}-\d{<span style="color: #800080;">1,<span style="color: #800080;">2}-\d{<span style="color: #800080;">1,<span style="color: #800080;">2<span style="color: #000000;">}
<span style="color: #800080;">12 一年的12个月(<span style="color: #800080;">01~09和1~<span style="color: #800080;">12):^(<span style="color: #800080;">0?[<span style="color: #800080;">1-<span style="color: #800080;">9]|<span style="color: #800080;">1[<span style="color: #800080;">0-<span style="color: #800080;">2<span style="color: #000000;">])$
<span style="color: #800080;">13 一个月的31天(<span style="color: #800080;">01~09和1~<span style="color: #800080;">31):^((<span style="color: #800080;">0?[<span style="color: #800080;">1-<span style="color: #800080;">9])|((<span style="color: #800080;">1|<span style="color: #800080;">2)[<span style="color: #800080;">0-<span style="color: #800080;">9])|<span style="color: #800080;">30|<span style="color: #800080;">31<span style="color: #000000;">)$
<span style="color: #800080;">14<span style="color: #000000;"> 钱的输入格式:
<span style="color: #800080;">15 <span style="color: #800080;">1.有四种钱的表示形式我们可以接受:<span style="color: #800000;">"<span style="color: #800000;">10000.00<span style="color: #800000;">" 和 <span style="color: #800000;">"<span style="color: #800000;">10,000.00<span style="color: #800000;">",和没有 <span style="color: #800000;">"<span style="color: #800000;">分<span style="color: #800000;">" 的 <span style="color: #800000;">"<span style="color: #800000;">10000<span style="color: #800000;">" 和 <span style="color: #800000;">"<span style="color: #800000;">10,000<span style="color: #800000;">":^[<span style="color: #800080;">1-<span style="color: #800080;">9][<span style="color: #800080;">0-<span style="color: #800080;">9]
<span style="color: #000000;">$
<span style="color: #800080;">16 <span style="color: #800080;">2.这表示任意一个不以0开头的数字,但是,这也意味着一个字符<span style="color: #800000;">"<span style="color: #800000;">0<span style="color: #800000;">"不通过,所以我们采用下面的形式:^(<span style="color: #800080;">0|[<span style="color: #800080;">1-<span style="color: #800080;">9][<span style="color: #800080;">0-<span style="color: #800080;">9]<span style="color: #000000;">)$
<span style="color: #800080;">17 <span style="color: #800080;">3.一个0或者一个不以0开头的数字.我们还可以允许开头有一个负号:^(<span style="color: #800080;">0|-?[<span style="color: #800080;">1-<span style="color: #800080;">9][<span style="color: #800080;">0-<span style="color: #800080;">9]
<span style="color: #000000;">)$
<span style="color: #800080;">18 <span style="color: #800080;">4.这表示一个0或者一个可能为负的开头不为0的数字.让用户以0开头好了.把负号的也去掉,因为钱总不能是负的吧.下面我们要加的是说明可能的小数部分:^[<span style="color: #800080;">0-<span style="color: #800080;">9]+(.[<span style="color: #800080;">0-<span style="color: #800080;">9]+)?<span style="color: #000000;">$
<span style="color: #800080;">19 <span style="color: #800080;">5.必须说明的是,小数点后面至少应该有1位数,所以<span style="color: #800000;">"<span style="color: #800000;">10.<span style="color: #800000;">"是不通过的,但是 <span style="color: #800000;">"<span style="color: #800000;">10<span style="color: #800000;">" 和 <span style="color: #800000;">"<span style="color: #800000;">10.2<span style="color: #800000;">" 是通过的:^[<span style="color: #800080;">0-<span style="color: #800080;">9]+(.[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">2})?<span style="color: #000000;">$
<span style="color: #800080;">20 <span style="color: #800080;">6.这样我们规定小数点后面必须有两位,如果你认为太苛刻了,可以这样:^[<span style="color: #800080;">0-<span style="color: #800080;">9]+(.[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">1,<span style="color: #800080;">2})?<span style="color: #000000;">$
<span style="color: #800080;">21 <span style="color: #800080;">7.这样就允许用户只写一位小数.下面我们该考虑数字中的逗号了,我们可以这样:^[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">1,<span style="color: #800080;">3}(,[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">3})(.[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">1,<span style="color: #800080;">2})?<span style="color: #000000;">$
<span style="color: #800080;">22 <span style="color: #800080;">8.1到3个数字,后面跟着任意个 逗号+3个数字,逗号成为可选,而不是必须:^([<span style="color: #800080;">0-<span style="color: #800080;">9]+|[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">1,[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">3})
)(.[<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">1,<span style="color: #800080;">2})?<span style="color: #000000;">$
<span style="color: #800080;">23 备注:这就是最终结果了,别忘了<span style="color: #800000;">"<span style="color: #800000;">+<span style="color: #800000;">"可以用<span style="color: #800000;">"<span style="color: #800000;"><span style="color: #800000;">"替代如果你觉得空字符串也可以接受的话(奇怪,为什么?<span style="color: #000000;">)最后,别忘了在用函数时去掉去掉那个反斜杠,一般的错误都在这里
<span style="color: #800080;">24 xml文件:^([a-zA-Z]+-?)+[a-zA-Z0-<span style="color: #800080;">9]+\.[x|X][m|M][l|<span style="color: #000000;">L]$
<span style="color: #800080;">25 中文字符的正则表达式:[\u4e00-<span style="color: #000000;">\u9fa5]
<span style="color: #800080;">26 双字节字符:[^\x00-<span style="color: #000000;">\xff] (包括汉字在内,可以用来计算字符串的长度(一个双字节字符长度计2,ASCII字符计1))
<span style="color: #800080;">27 空白行的正则表达式:\n\s
<span style="color: #000000;">\r (可以用来删除空白行)
<span style="color: #800080;">28 HTML标记的正则表达式:<(\S?)[^>]>.?</\<span style="color: #800080;">1>|<.? /><span style="color: #000000;"> (网上流传的版本太糟糕,上面这个也仅仅能部分,对于复杂的嵌套标记依旧无能为力)
<span style="color: #800080;">29 首尾空白字符的正则表达式:^\s|\s$或(^\s)|(\s<span style="color: #000000;">$) (可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等),非常有用的表达式)
<span style="color: #800080;">30 腾讯QQ号:[<span style="color: #800080;">1-<span style="color: #800080;">9][<span style="color: #800080;">0-<span style="color: #800080;">9]{<span style="color: #800080;">4<span style="color: #000000;">,} (腾讯QQ号从10000开始)
<span style="color: #800080;">31 中国邮政编码:[<span style="color: #800080;">1-<span style="color: #800080;">9]\d{<span style="color: #800080;">5}(?!<span style="color: #000000;">\d) (中国邮政编码为6位数字)
<span style="color: #800080;">32 IP地址:\d+.\d+.\d+.\d+<span style="color: #000000;"> (提取IP地址时有用)
<span style="color: #800080;">33 IP地址:((?:(?:<span style="color: #800080;">25[<span style="color: #800080;">0-<span style="color: #800080;">5]|<span style="color: #800080;">2[<span style="color: #800080;">0-<span style="color: #800080;">4]\d|[<span style="color: #800080;">01]?\d?\d)\.){<span style="color: #800080;">3}(?:<span style="color: #800080;">25[<span style="color: #800080;">0-<span style="color: #800080;">5]|<span style="color: #800080;">2[<span style="color: #800080;">0-<span style="color: #800080;">4]\d|[<span style="color: #800080;">01]?\d?\d)) (由@飞龙三少 提供,感谢共享)

大佬总结

以上是大佬教程为你收集整理的JavaScript之正则表达式学习笔记全部内容,希望文章能够帮你解决JavaScript之正则表达式学习笔记所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ群:277859234,请注明来意。
标签:JavaScript之正则表达式学习笔记
猜你在找的程序笔记相关文章
其他相关热搜词更多
php如何使用2javascriptJavaPythoncocos编程问答c#csschtmlrubyjsd3cocos2d文件
全站导航更多
最新程序笔记教程
热门程序笔记教程