正则表达式

正则表达式是用于匹配字符串中字符组合的模式。在JavaScript中,正则表达式也是对象。这些模式被用于RegExpexectext方法,以及String中的 matchmatchAllreplace search split方法

创建表达式

字面量

使用两个 / 直接创建正则表达,已斜杠表示开始和结束

var	reg	=	/ab/g

当脚本加载后,正则表达式字面量就会被编译。当正则表达式保存不变时,使用此方法可获得更好的性能。

RegExp构造函数

var reg = new RegRxp('ab','g')
// 等价于 var reg = /ab/g

字面量创建斜杠结束后面参数和构造函数第二个参数表示修饰符。

上面两种写法是等加价的都新建了一个在正则表达式对象。区别在于,第一种再引擎编译代码时,就会新建正则表达式。第二种方法在运行时新建表达式,所以字面量效率更高。并且字面量比较便利直观,基本上都会采用字面量定义正则表达式。

实例属性

正则修饰符相关实例属性(只读)

  • ignoreCase:返回布尔值,表示是否设置了i修饰符
  • global:返回布尔值,表示是否设置了g修饰符
  • multiline:返回布尔值,表示是否设置了m修饰符
  • flags:返回一个字符串,包含设置的所有修饰符

与修饰符无关实力属性:

  • lastIndex:返回一个证书,表示下一次开始搜索的位置
  • source:返回正则表达式的字符串形式,只读
var reg = /abc/gim
//修饰符相关属性
reg.ignoreCase //true
reg.global //true
reg.multiline //true
reg.flags //gim
//修饰符无关属性
reg.lastIndex //0
reg.source //abc

实例方法

正则实例方法

test()

在字符串中测试是否匹配,返回值味 true false

var reg = /av/g
var s = 'avbabc'
reg.test(s) //true reg.lastIndex = 2
reg.test(s) //false

当正则表达式带有g修饰符时,每一次test方法都会从上一次结束的位置开始向后匹配,可以使用lastIndex查看当前位置

var reg = /av/g
var s = 'avbavabc' reg.lastIndex //0
reg.test(s) //true reg.lastIndex //2
reg.test(s) //true reg.lastIndex //5
reg.test(s) //false

如果正则表达式是一个空字符串,则匹配所有的字符串,都返回true

exec()

在字符串中执行查找匹配的字符,返回一个数组,未匹配到返回null

exec方法返回数组包含两个属性:

  • input:整个原字符串
  • index:模式匹配成功的开始位置索引
var reg = /av/g
var s = 'avbavabc' reg.exec(s) //["av", index: 0, input: "avbavabc", groups: undefined]
reg.exec(s) //["av", index: 3, input: "avbavabc", groups: undefined]
reg.exec(s) //null

同test一样,当正则表达式带有g修饰符时,每一次exec方法都会从上一次结束的位置开始向后匹配,可以使用lastIndex查看当前位置

当正则表达式包含()组匹配时,返回的数组包含多个匹配数据,第一个是整个正则匹配成功的结果,第二个为括号内的匹配结果,如果有多个括号,第三个为第二个括号内的匹配内容。依次类推。

var reg = /a(v)/g
var s = 'avbavabc' reg.exec(s) //[ 'av', 'v', index: 0, input: 'avbavabc', groups: undefined ]
reg.exec(s) //[ 'av', 'v', index: 3, input: 'avbavabc', groups: undefined ]
reg.exec(s) //null

多个()

var reg = /a(v)(b)/g
var s = 'avbavabc' reg.exec(s) // [ 'avb', 'v', 'b', index: 0, input: 'avbavabc', groups: undefined ]
reg.exec(s) //null

String实例方法

match()

在字符串中执行查找匹配的字符,返回一个数组,未匹配到返回null

当正则表达式不带有g修饰符是,返回的数组带有indexiuput属性

var reg = /ac/
var s = 'acbacvabc'
var s1 = 'aabaavabc' s.match(reg) //[ 'ac', index: 0, input: 'acbacvabc', groups: undefined ]
s1.match(reg) //null

正则表达式带有g修饰符时,该方法会一次性返回所有匹配成功的结果数组。不再带有indexinput属性

var reg = /ac/g
var s = 'acbacvabc' s.match(reg) //[ 'ac', 'ac' ]

注意:设置正则表达式的lastindex属性对match方法无效,match方法总是从字符串第一个开始匹配。

matchAll()

在字符串中执行查找所有匹配的字符,返回一个迭代器。注意 ,在使用matchAll时,正则表达式需要带有g修饰符,否则会运行报错。

var reg = /a/g
var s = 'acbacvabc' arr = [...s.matchAll(reg)]
console.log(arr)
//输出:
/**
[
[ 'a', index: 0, input: 'acbacvabc', groups: undefined ],
[ 'a', index: 3, input: 'acbacvabc', groups: undefined ],
[ 'a', index: 6, input: 'acbacvabc', groups: undefined ]
]
**/

search()

在字符串中执行查找匹配的字符,返回第一个匹配到字符的位置,未匹配到返回-1

var reg = /en/g
var reg1 = /yo/g
var s = 'yuwenbo' s.search(reg) //3
s.search(reg1) //-1

replace()

在字符串中执行查找匹配的字符,并且使用替换字符串替换匹配到的子字符串。两个参数一个是正则表达式,一个是需要替换的内容。

如果正则没有g修饰符,只替换第一个匹配成功的值。如果有g修饰符,则替换所有匹配成功的值。

var s = 'i love you'
console.log(s.replace(/\s/, '')) //ilove you
console.log(s.replace(/\s/g, '')) //iloveyou

replace第二个参数可以使用$符号,用来更加方便的制定所替换的内容

  • $&:匹配的子字符串
  • `$``:匹配结果前面的文本
  • $':匹配结果后面的文本
  • $n:匹配成功的第n组内容,n是从1开始的自然数
  • $$:指代美元符号$
console.log('he llo'.replace(/(\w+)\s(\w+)/, '$2 $1')) //llo he
console.log('hello'.replace(/e/, '-$`-$&-$\'-')) //h-h-e-llo-llo

replace的第二个参数也可以作为一个函数,将每一个正则匹配内容替换为函数的返回值

函数可以接受多个参数,第一个为匹配到的内容,后面为组匹配内容(可以有多个组匹配),倒数第二个参数为匹配内容再字符串中的位置,倒数第一个参数为原字符串。

console.log('hello'.replace(/e/, function (match, index, str) {
console.log(match, index, str)
return ''
})) //e 1 hello
//hllo

split()

使用正则表达式或者一个固定字符串分割一个字符串,并将分割后的子字符串存储到数组中

该方法可接受两个参数,第一个参数为正则表达式,表示分割规则,第二个参数是返回数组的最大成员数

str = 'ni hao ya.hei hei hei'
str.split(/ |\./, 5) //[ 'ni', 'hao', 'ya', 'hei', 'hei' ]

总结:

判断字符串是否被匹配到,使用test或者search方法

想获得更多的信息,使用exec或者,match方法,会比较慢。

修饰符(标志符)

修饰符表示附加规则,放在正则模式的最尾部。可以单个使用,也可以一起使用。

//单个修饰符
'abAbab'.match(/a/g) //["a","a"] //多个修饰符一起使用
'abAbab'.match(/a/gi) //["a", "A", "a"]

g修饰符

全局搜索,默认情况下只匹配一次,就停止像下匹配了,加上修饰符会一直向下搜索

i修饰符

默认情况下会区分匹配字符串的大小写情况

m修饰符

多行搜索,多行模式,会修改^$的行为

默认情况下,^$匹配字符串的开始处和结尾处

加上m修饰符,^$还会匹配行首和行尾,即^$会识别换行符\n

例如:

  • /yewen$/m.test('hi yuwen\n')true 
  • /yewen$/.test('hi yuwen\n')false

s修饰符

允许.匹配换行符

u修饰符

使用unicode码的模式进行匹配

y修饰符

执行 粘性搜索匹配从目标字符串的当前位置开始

特殊字符

\字符

转义字符

正则表达式中需要匹配特殊字符本身,需要再前面家反斜杠\

正则表达式中,需要反斜杠转义的:^,.,[,$,(,),|,*,+,?,{,\

^字符

匹配开始位置

如果设置多行标志,那么也匹配换行符后的位置

例如:/^A/会匹配 "Ant"中的A,但是不会匹配"ntA"中的A

$字符

匹配结束位置

如果设置多行标志,那么也匹配换行符前的位置

例如:/A$/会匹配 "ntA"中的A,但是不会匹配"Ant"中的A

*字符

匹配一个表达式0次或多次

等价于 {0, }

例如:/yueno*/会匹配 "yuenoooyuen"中的yuenoooyuen

+字符

匹配一个表达式1次或多次

等价于 {1, }

例如:/yueno+/只会匹配 "yuenoooyuen"中的yuenooo

?字符

匹配一个表达式0次或1次

等价于 {0, 1}

  • 例如:/yueno?/只会匹配 "yuenoooyuen"中的yueno
  • 注意:?如果紧跟再任何量词 *+?{}的后面,将会使量词变得非贪婪(匹配尽量少的字符)
  • 例如:/yueno??/只会匹配 "yuenoooyuen"中的yuen

.字符

默认匹配出换行符之外的任何单个字符

  • 例如:/.y/只会匹配 "yuenoooyuen"中的oy
  • 例如:/..y/只会匹配 "yuenoooyuen"中的ooy

(x)字符

捕获括号

正则表达式中的括号表示分组匹配,括号中的模式可以用匹配分组的内容

分组匹配可以使用\n

正则替换中,可以使用$1,$2语法

  • 例如:/(wenbo)+/.test('wenbowenbo')true,表示匹配wenbo整体一次或多次
  • 例如:"wenbo,zhijian".replace(/(wenbo),(zhijian)/, '$2,$1')
  • 输出:zhijian,wenbo

(?=x)字符

匹配X但是不记住匹配项

非捕获括号,使你能够定义与正则表达式运算符一起使用的子表达式

使用非捕获括号,能匹配元素,但是不能在使用\n$n方法

x(?=y)字符

匹配> x,仅仅当> x后面是> y> ,先行断言

  • 例如:'wenbo'.match(/wen(?=bo)/)
  • 输出:[ 'wen', index: 0, input: 'wenbo', groups: undefined ]
  • 例如:'wenyu'.match(/wen(?=bo)/)
  • 输出:null

(?<=y)x字符

匹配> x,仅仅当> x前面是> y ,> 后行断言

  • 例如:'wenbo'.match(/(?<=wen)bo/)
  • 输出:[ 'bo', index: 3, input: 'wenbo', groups: undefined ]
  • 例如:'yubo'.match(/(?<=wen)bo/)
  • 输出:null

x(?!y)字符

匹配> x,仅仅当> x后面不是> y时,> 正向否定查找

(?<=y)x字符

匹配> x,仅仅当> x前面不是> y> ,反向否定查找

x|y字符

匹配> x或者> y 可以连用

  • 例如:'wenyu'.match(/w|e|n/g)
  • 输出:[ 'w', 'e', 'n' ]

{n}字符

匹配前面一个字符刚好出现> n次,> n> 是一个正整数

  • 例如:'hello'.match(/l{2}/g)
  • 输出:[ 'll' ]

{n,}字符

匹配一个字符至少出现了> n次,> n> 是一个正整数

{n,m}字符

匹配前面的字符至少> n> 次最多> m> 次,> n> ,> m是> 为正整数>

[xyz]字符

字符集合> 匹配方括号中的任意字符,包括转义字符,可以使用破折号(-)制定一个字符,> 例如:> [a-zA-Z1-9]>

  • 例如:'hello 123'.match(/[a-h1-2]/g)
  • 输出:[ 'h', 'e', '1', '2' ]

[^xyz]字符

反向字符集,> 匹配任何没有包含再方括号中的字符

  • 例如:'hello 123'.match(/[^a-h1-2]/g)
  • 输出:[ 'l', 'l', 'o', '3' ]

[\b]字符

匹配一个退格(U+0008),不是> \b,不要弄混了

\b字符

匹配一个词的边界

例如:

  • /\bworld/.test('hello world') // true
  • /\bworld/.test('hello-world') // true
  • /\bworld/.test('helloworld')  // false

\B字符

匹配一个非单词边界

例如:

  • /\bworld/.test('hello world') // false
  • /\bworld/.test('hello-world') // false
  • /\bworld/.test('helloworld')  // true

\cX字符

当X是出于A到Z之间字符的时候,匹配字符串中的一个控制符

\d字符

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

\D字符

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

\D字符

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

\f字符

匹配一个换页符(U+000C)

\n字符

匹配一个换行符(U+000A)

\r字符

匹配一个回车符

\s字符

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

[\f\n\r\t\v\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]

\S字符

匹配一个非空白字符

\t字符

匹配一个水平制表符

\v字符

匹配一个垂直制表符

\w字符

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

\w字符

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

\W字符

匹配一个非单字字符

\n字符

返回最后的第n个字捕获匹配的子字符,> 捕获的数目以左括号计算

\0字符

匹配NULL字符(U+0000)

\xhh字符

匹配一个两位十六进制数表示的字符(\x00-\xFF)

\uhhhh字符

匹配一个四位十六进制数表示的UTF-16代码单元

\u{hhhhh}字符或\u{hhhh}

(仅当设置了U标志时)匹配一个十六进制时候表示的Unicode字符

JavaScript深入理解-正则表达式的更多相关文章

  1. 浅谈JavaScript中的正则表达式

    引言 对于正则表达式我想作为程序员肯定使用过它,那天书般的表达方式,我用一次就记住它了.这篇博客先介绍一些正则表达式的内容,然后介绍JavaScript中对正则表达式特有的改进.下面开始介绍正则表达式 ...

  2. C++、Java、JavaScript中的正则表达式

    C++(VS2013编译器):http://msdn.microsoft.com/zh-cn/library/bb982727.aspx#grammarsummary Java:            ...

  3. 浅谈JavaScript中的正则表达式(适用初学者观看)

    浅谈JavaScript中的正则表达式 1.什么是正则表达式(RegExp)? 官方定义: 正则表达式是一种特殊的字符串模式,用于匹配一组字符串,就好比用模具做产品,而正则就是这个模具,定义一种规则去 ...

  4. 精通 JavaScript中的正则表达式

    精通 JS正则表达式 (精通?标题党 ) 正则表达式可以: •测试字符串的某个模式.例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个电话号码模式或一个信用卡号码模式.这称为数据有效性验证  ...

  5. JavaScript中的正则表达式详解

    摘要:javascript中的正则表达式作为相当重要的知识,本文将介绍正则表达式的相关知识和用法. 正则表达式(Regular Expression)是一门简单语言的语法规范,是强大.便捷.高效的文本 ...

  6. JavaScript中的正则表达式(终结篇)

    JavaScript中的正则表达式(终结篇) 在之前的几篇文章中,我们了解了正则表达式的基本语法,但那些语法不是针对于某一个特定语言的.这篇博文我们将通过下面几个部分来了解正则表达式在JavaScri ...

  7. Javascript中的正则表达式

    Javascript中的正则表达式 刚开始接触正则表达式的时候,觉得这是个很死板的东西(没办法,计算机不能像人眼一样能很快的辨认出我们需要的结果,它需要一定的规则来对它进行限制),了解的越多,发现这个 ...

  8. Javascript中理解发布--订阅模式

    Javascript中理解发布--订阅模式 阅读目录 发布订阅模式介绍 如何实现发布--订阅模式? 发布---订阅模式的代码封装 如何取消订阅事件? 全局--发布订阅对象代码封装 理解模块间通信 回到 ...

  9. 转载 javascript中的正则表达式总结 一

    定义正则表达式的方法 定义正则表达式的方法有两种:构造函数定义和正则表达式直接量定义.例如: var reg1 = new RegExp('\d{5, 11}'); // 通过构造函数定义 var r ...

随机推荐

  1. 心之所向·智慧绽放丨NGK区块链赋能实体经济论坛圆满落幕

    据外媒报导,近日,由NGK主办的"NGK区块链赋能实体经济论坛"于英国伦敦的威斯敏斯特中央大厅圆满落幕.大会现场到来了NGK北美市场领导人.区块链行业的专业人士.NGK英国社区代表 ...

  2. MySQL学习04(DQL查询)

    DQL查询 DQL语言 DQL( Data Query Language 数据查询语言 ) 查询数据库数据 , 如SELECT语句 简单的单表查询或多表的复杂查询和嵌套查询 是数据库语言中最核心,最重 ...

  3. 一文读懂网管协议 - SNMP,NETCONF,RESTCONF

    本文篇幅较长,主要涉及以下内容: 介绍传统 CLI 配置网络设备存在的挑战,网管协议出现的背景 SNMP 原理,交互过程,以及 trade-off NETCONF 架构,交互过程 RESTCONF 架 ...

  4. Tawk.to一键给自己的网站增加在线客服功能

    Tawk.to一键给自己的网站增加在线客服功能 很多外贸网站只有contact页面,留下邮箱.电话等联系方式,而在国际贸易当中能够及时在线交流沟通,能给客户留下更好的印象.接下来,就让我们一起来了解一 ...

  5. OAuth2理解

    OAuth2: 1.他是针对特定问题的一种解决方案 OAuth2主要可以解决两个问题: (1)开放系统间的授权问题 例如:当你想要一个打印机器去打印自己百度网盘中的照片时,该机器并没有访问自己百度网盘 ...

  6. docker数据卷的操作

    一般情况下会比较频繁的修改容器内部的文件 频繁docker cp 不太方便 使用数据卷可以将宿机的某个目录映射至容器的目录 修改会方便点 1.创建数据卷 docker volume create 数据 ...

  7. 微信小程序:页面全局参数(注意不是小程序的全局变量globalData)

    为什么要使用页面全局参数:方便使用数据. 由于总页数需要再另外的一个方法中使用,所以要把总页数变成一个页面全局参数.因为取数据使用this.xxx即可,中间不用加data,给页面全局参数赋值页方便,直 ...

  8. DRF简介/接口概念

    目录 一.drf框架简介 1. drf安装 2. drf的优势 二.接口 1. 接口的概念 2. 接口文档 3. 接口规范(restful) 3.1 url链接规范 3.2 请求方式规范 3.3 响应 ...

  9. 01.从0实现一个JVM语言之架构总览

    00.一个JVM语言的诞生过程 文章集合以及项目展望 源码github地址 这一篇将是架构总览, 将自顶向下地叙述自制编译器的要素; 文章目录 01.从0实现一个JVM语言之架构总览 架构总览目前完成 ...

  10. Kubernetes Container lifecycle hooks

    简介 在kubernetes中,容器hooks旨在解决服务进程启动与停止时的一些优雅操作需求.比如说进程停止时要给进程一个清理数据的时间,保证服务的请求正常结束,而不是强行中断服务的运行,这样在生产环 ...