1.正则表达式的定义

  正则表达式是一个描述字符模式的对象。JavaScript的RegExp类表示正则表达式,String和RegExp都定义了方法,后者使用正则表达式进行强大的模式匹配和文本检索与替换功能,JavaScript的正则表达式语法是Perl5的正则表达式语法的大型子集

1.直接量定义(perl风格,本人较习惯用直接量):var reg = /exp/attributes

  var pattern = /ccy$/;//匹配以ccy结尾的字符串;

注:同一段代码所表示的正则表达式每次运行时直接量会转换成不同的RegExp对象
2.RegExp对象定义(js风格):var reg = new RegExp(exp, attributes);

  var pattern = new RegExp("ccy$");;//匹配以ccy结尾的字符串;

2.直接量字符

  正则表达式中的所有字母和数字都是按照字面含义进行匹配的。JavaScript正则表达式语法也支持非字母的字符匹配,这些字符需要通过反斜杠作为前缀进行转义。

字母和数字字符 自身
\o NUL字符
\t 制表符
\n 换行符
\v 垂直制表符
\f 换页符
\r 回车符
\xnn 由十六进制nn指定的拉丁字符
\uxxxx 由十六进制xxxx指定的Unicode字符
\cX 控制符^X

demo:
        /\n/.test('\nccy');//true        匹配    \nccy
        /\n/.test('\\nccy');//false     不匹配    \ccy
        /\n/.test('\\\nccy');//true        匹配    \\nccy

3.字符匹配

字符 匹配
[...] 方括号内的任意字符
[^...] 不在方括号内的任意字符
. 除换行符和其他Unicode行终止符之外的任意字符
\w 任何ASCII字符组成的单词,等价于[a-zA-Z0-9]
\W 任何非ASCII字符组成的单词,等价于[^a-zA-Z0-9]
\s 任何Unicode空白符
\S 任何非Unicode空白符
\d 任何ASCII数字,等价于[0-9]
\D 任何非ASCII数字,等价于[^0-9]
[\b] 退格直接量

demo:

/\w\w\d\d\d/.test('lt666');//true    匹配两个字母或者数字加三个数字的字符串

4.重复字符匹配

字符 匹配
{n,m} 前一项至少n次,但不超过m次
{n,} 前一项n次或者更多次
{n} 前一项n次
? 前一项0次或者1次,等价于{0,1}
0 前一项至少1次或者更多次,等价于{1,}
* 前一项0次或者更多次,等价于{0,}

demo:

/\d{4,9}/.test(1314);//true        匹配4到9个数字
//下面的例子稍微有点复杂,仔细分析也很简单
/\w{3}\s?\w{2,4}\s+javascript+\s+[^(]*/.test('ccy is javascript coder');//true        匹配3个字母或数字加0个或1个空格加2到4个字母或数字加至少1个空格加javascript加至少1个空格加0个或多个左反圆括号字符

重复匹配还种模式:非贪婪模式(尽可能的少匹配),只需在待匹配的字符后跟随一个?

??、+?、*?、{1,5}?

/\d{4,9}/.exec(131414131);//131414131
/\d{4,9}?/.exec(131414131);//1314
下面这种情况贪婪和非贪婪是一样的效果
/c+y/.exec('ccy');//ccy
/c+?y/.exec('ccy');//ccy
这是因为正则表达式的模式匹配总是会寻找字符串中第一个可能匹配的位置

5.选择、分组和引用

javascript正则语法还包括指定选择项、子表达式分组和引用前一子表达式的特殊字符。

字符 含义
| 选择,匹配的是该符号左边的子表达式或者右边的子表达式
(…) 组合,将几个项组合为一个单元,这个单元可通过* + ? | 等符号加以修饰,而且记住和这个组合相匹配的字符串以供此后的引用使用
(?:...) 只组合,把项组合到一个单元,但不记忆与改组相匹配的字符
\n 和第n个分组第一次匹配的字符相匹配,组是圆括号中的子表达式(也可能是嵌套的),组索引是从左到右的左括号数,(?: 形式的分组不编码

1.选择

字符 | 用于分隔供选择的字符,选择项的尝试匹配是从左至右,直到发现了匹配项。

注:如果左边的选择项匹配就会忽略右边的匹配项,即使它产生更好的匹配

2.组合引用

正则表达式中的圆括号 () 有多中作用:

a.一个是把单独的项组合成子表达式;

b.一个是在完整的模式中定义子模式;

c.允许在同一正则表达式的后部引用前面的子表达式,引用的是实例而非匹配模式。

注:perl风格的\n,RegExp对象则$n,以左圆括号为子表达式索引,从1开始

'AA Am 99'.match(/(\w)\1/g);//["AA","99"]

/(A+)((B|C|D)+)(E+)/.exec('ABCDE');//["ABCDE","A","BCD","D","E"];

6.指定匹配位置

正则表达式中匹配位置是一个难点

锚字符与断言

字符 含义
^ 匹配字符串的开头,在多行检索中匹配一行的开头
$ 匹配字符串的结尾,在多行检索中匹配一行的结尾
\b 匹配一个单词的边界,就是位于\w与\W之间的位置
\b 匹配非单词边界的位置
(?=x) 零宽度正先行断言。仅当子表达式 X 在 此位置的右侧匹配时才继续匹配。例如,/w+(?=/d) 与后跟数字的单词匹配,而不与该数字匹配。此构造不会回溯。
(?!=x) 零宽度负先行断言。仅当子表达式 X 不在 此位置的右侧匹配时才继续匹配。例如,例如,/w+(?!/d) 与后不跟数字的单词匹配,而不与该数字匹配 。
(?<=X) 零宽度正后发断言。仅当子表达式 X 在 此位置的左侧匹配时才继续匹配。例如,(?<=19)99 与跟在 19 后面的 99 的实例匹配。此构造不会回溯。
(?<!X) 零宽度负后发断言。仅当子表达式 X 不在此位置的左侧匹配时才继续匹配。例如,(?<!19)99 与不跟在 19 后面的 99 的实例匹配

demo:

要匹配<title>javascript</title>中的javascript,此时用断言最合适

/(?<=<title>).*(?=<\/title>)/.exec('<title>javascript</title>');//javascript

(?<=<title>)零宽度正后发断言,断言<title>在当前位置左侧;

(?=<\/title>)零宽度正先行断言,断言</title>在当前位置的右侧,/ 需要加 \ 转义

细心体会一下

不用断言截取如下

'<title>javascript</title>'.match(/^<title>(.*)<\/title>$/)[1];//javascript

7.修饰符

字符 含义
I 不区分大小写
g 全局匹配
m 多行匹配模式

8.用于匹配模式的String方法

1.search(reg)

参数reg为正则表达式,返回第一个与之匹配的子串的起始位置,如找不到则返回-1
"javascript".search(/script/i); //4

注:search方法不支持全局检索,因为它会忽略正则表达式中的修饰符g
2.replace(reg,str)

用以执行检索与替换操作,注意出现$n则说明匹配子表达式
"javascript".replace(/javascript/gi,"JavaScript");
3.match(reg)

返回一个由匹配结果组成的数组,如果reg中设置了修饰符g,则返回的数组包含字符串中的所有匹配结果,若没有g,就不会进行全局检索,只会检索第一个匹配。
"1 plus 2 equals 3".match(/\d+/g); 返回["1","2","3"]
4.split(param)

参数可以为字符串也可以为正则表达式
"1,2,3,4,5".split(/,/);返回["1","2","3","4","5"]

我们经常会匹配浏览器中cookie值

document.cookie="name=ccy;age=18";

/(^|;| )age=([^;]*)(;|$)/g.exec(document.cookie)[2];//18

9.RegExp对象

RegExp第一个参数包含正则表达式的主体部分,也就是直接量中两条斜线之间的文本,不论是字符串直接量还是正则表达式都使用 \ 字符作为转义字符的前缀,
因此当给RegExp()传入一个字符串表述正则表达式时,必须将 \ 替换成 \\
第二个参数是可选的,只能传 g i m,或者它们的组合
var zipcode = new RegExp("\d{5}","g");

1.RegExp属性
source:是一个只读字符串,包含正则表达式的文本
global:是一个只读的布尔值,用以说明这个正则表达式是否带有修饰符g
ignoreCase:是一个只读的布尔值,用以说明正则表达式是否带有修饰符i
multiline:是一个只读的布尔值,用以说明正则表达式是否带有修饰符m
lastIndex:是一个可读/写的整数,如果匹配模式带有g修饰符,这个属性存储在整个字符串的下一次检索的开始位置,会被exec(),test()方法用到

2.RegExp方法
exec()
执行字符串的匹配检索,类似String.match(),都会返回一个数组
test()
当调用exec方法返回不为null则调用test方法返回为true

浅析JavaScript正则表达式的更多相关文章

  1. JavaScript正则表达式,你真的知道?

    一.前言 粗浅的编写正则表达式,是造成性能瓶颈的主要原因.如下: var reg1 = /(A+A+)+B/; var reg2 = /AA+B/; 上述两个正则表达式,匹配效果是一样的,但是,效率就 ...

  2. 【JS】javascript 正则表达式 大全 总结

    javascript 正则表达式 大全 总结 参考整理了一些javascript正则表达式 目的一:自我复习归纳总结 目的二:共享方便大家搜索 微信:wixf150 验证数字:^[0-9]*$ 验证n ...

  3. 理清JavaScript正则表达式--上篇

    在JavaScript中,正则表达式由RegExp对象表示.RegExp对象呢,又可以通过直接量和构造函数RegExp两种方式创建,分别如下: //直接量 var re = /pattern/[g | ...

  4. 理清JavaScript正则表达式--下篇

    紧接:"理清JavaScript正则表达式--上篇". 正则在String类中的应用 类String支持四种利用正则表达式的方法.分别是search.replace.match和s ...

  5. JavaScript正则表达式详解(一)正则表达式入门

    JavaScript正则表达式是很多JavaScript开发人员比较头疼的事情,也很多人不愿意学习,只是必要的时候上网查一下就可以啦~本文中详细的把JavaScript正则表达式的用法进行了列表,希望 ...

  6. JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解

    二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...

  7. Python自动化 【第十八篇】:JavaScript 正则表达式及Django初识

    本节内容 JavaScript 正则表达式 Django初识 正则表达式 1.定义正则表达式 /.../  用于定义正则表达式 /.../g 表示全局匹配 /.../i 表示不区分大小写 /.../m ...

  8. JavaScript正则表达式下——相关方法

    上篇博客JavaScript 正则表达式上——基本语法介绍了JavaScript正则表达式的语法,有了这些基本知识,可以看看正则表达式在JavaScript的应用了,在一切开始之前,看看RegExp实 ...

  9. JavaScript 正则表达式上——基本语法

    定义 JavaScript种正则表达式有两种定义方式,定义一个匹配类似 <%XXX%> 的字符串 1. 构造函数 var reg=new RegExp('<%[^%>]+%&g ...

随机推荐

  1. Java集合:HashSet的源码分析

    Java集合---HashSet的源码分析   一.  HashSet概述: HashSet实现Set接口,由哈希表(实际上是一个HashMap实例)支持.它不保证set 的迭代顺序:特别是它不保证该 ...

  2. linux_vim编辑文件无法高亮显示解决方法

    打开/etc/vimrc(/etc/vim/vimrc不同版本,可能不一样) 在文档最后添加下面内容 syntax on 如图所示:我添加了高亮显示和显示行数 syntax on set nu 修改完 ...

  3. js 时间戳转日期

    timestampToTime(10位时间戳) function timestampToTime(timestamp) { var date = new Date(timestamp * 1000); ...

  4. 14.2.4HTML5约束API验证

    <body> <form> <!-- required属性在提交表单时不能空着 这个属性适用于<input> <textarea> <sel ...

  5. PgAgent安装、配置、运行

    一 安装cmakewget http://www.cmake.org/files/v2.8/cmake-2.8.5.tar.gztar -zxvf cmake-2.8.5.tar.gzcd /root ...

  6. java数组-如何在一堆数据中使用数组!

    数组 1.类型一致的一组数据,其实相当于集合概念. 数组描述的是相同类型的若干个数据,按照一定的先后次序排列组合而成.其中,每一个数据称作一个数组元素(item),每个数组元素可以通过一个下标/索引来 ...

  7. maya2012卸载/安装失败/如何彻底卸载清除干净maya2012注册表和文件的方法

    maya2012提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装maya2012失败提示maya2012安装未完成,某些产品无法安装,也有时候想重新安装maya ...

  8. weblogic安装及配置

    WebLogic是用于开发.集成.部署和管理大型分布式Web应用.网络应用和数据库应用的Java应用服务器. 1.安装Weblogic:(1)点击Next按钮:(2) 选择Custom后点击Next按 ...

  9. OpenStack-Ocata版+CentOS7.6 云平台环境搭建 — 4.镜像服务(glance)

    节点配置信息说明: 控制节点:controller: IP:192.168.164.128 hostname&hosts:likeadmin 计算加点:Nova: IP:192.168.164 ...

  10. Testing - 软件测试知识梳理 - 理解测试

    理解 目的 测试就是要找到关键信息,有关项目和产品的关键决策都是根据这些信息做出. 对产品质量做出总体评估. 找出并报告团队所有可能会对产品价值产生消极影响的问题(但并不意味着能发现所有问题). 重心 ...