正则表达式(RegExp)

如何按一定规则快速查找到需要找寻的内容,js的设计者们给我们提供了一个叫正则表达式(RegExp对象),专门用于处理类似问题。

RegExp对象表示正则表达式,它是对字符串执行模式匹配的强大工具。

正则表达式--基本概念

在计算机科学中,是指一个用来描述或者匹配一系列符合某个句法规则的字符串的单个字符串。在很多文本编辑器或其他工具里,正则表达式通常被用来检索或替换那些符合某个模式的文本内容。许多程序设计语言都支持利用正则表达式进行字符串操作。

特别强调:正则表达式不是js的专利产品,实际上很多程序设计语言都支持正则表达式进行字符串操作。

一个正则表达式,就是用某种模式去匹配一类字符串的一个公式。很多人因为它们看上去比较古怪而且复杂所以不敢去使用,不过,经过一点点练习之后,就觉得这些复杂的表达式其实写起来还是相当简单的,而且,一旦你弄懂它们,你就能把数小时辛苦而且易错的文本处理工作缩短在几分钟(甚至几秒钟)内完成。

快速入门案例

给你一个字符串(或一篇文章),请你找出所有四个数字连在一起的子串?

代码如下:(IE9测试通过,Chrome未通过)

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function test() {
var con = content.innerText;
var myReg = /(\d){4}/gi;//这是一个正则表达式对象,可以检索4个连续的数
//var myReg = new RegExp("(\\d){4}", "gi");
while(res = myReg.exec(con)) {//res是检索出来的结果,但是一个结果就对应一个数组,该数组的res[0]就是找到的那个文本
window.alert("找到"+res[0]);
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea>
<input type="button" onclick="test()" value="检索" />
</body>
</html>

exec()方法用于检索字符串中的正则表达式的匹配。

语法:RegExpObject.exec(string)

如果exec()找到了匹配的文本,则返回一个结果数组。否则,返回 null。此数组的第0个元素是与正则表达式相匹配的文本,第1个元素是与RegExpObject的第1个子表达式相匹配的文本(如果有的话),第2个元素是与RegExpObject的第2个子表达式相匹配的文本(如果有的话),以此类推。

小结:

创建一个RegExp对象有两种方法:

  1. var regExp=/正则表达式/gi; (隐式创建)
  2. var regExp=new RegExp(“正则表达式”,"gi"); (显示创建)

特别说明:g表示正则表达式执行全局匹配,i表示正则表达式不区分大小写的匹配,m表示多行模式(考虑换行)。

正则表达式对象

RegExp对象表示正则表达式,它是对字符串执行模式匹配的强大工具。

创建RegExp对象有以下几种方法:

1、隐式创建RegExp对象

它的创建形式是/pattern/[flag]这种形式;说明:pattern是必需的,flag是可选择的。

pattern就是按照正则表达式的模式进行编写,flag是可以选择的,它主要有以下几种标识符:g全局标志、i忽略大小写、m用作多行标志。

2、显示的创建RegExp对象

它的创建形式是new RegExp("pattern"[,"flag"]); 说明:pattern是必需的,flag是可选择的。

pattern就是按照正则表达式的模式进行编写,flag是可以选择的,它主要有以下几种标识符:g全局标志、i忽略大小写、m用作多行标志。

例,

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function test() {
var con = content.innerText;
var myReg = /abc/gi;
if(myReg.test(con)) {
alert("有abc");
} else {
alert("没有abc");
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea>
<input type="button" onclick="test()" value="检索" />
</body>
</html>

test()方法用于检测一个字符串是否匹配某个模式。

语法:RegExpObject.test(string)

如果字符串string中含有与RegExpObject匹配的文本,则返回true,否则返回false。

string对象与正则表达式有关的方法

常用的方法

①match()

语法格式为:match(reExp)

与RegExp对象的exec方法类似,它使用正则表达式模式对字符串执行搜索,并返回一个包含搜索结果的数组。

②search()

语法格式为:search(reExp)

它返回使用正则表达式搜索时,第一个匹配的字符串在整个被搜索的字符串中的位置。

③replace()

语法格式为:replace(reExp,replaceText)

使用正则表达式模式对字符串执行搜索,并对搜索到的内容用指定的字符替换,返回值为包含替换后的内容的字符串对象。

④split()

语法格式为:split(regExp)或split("按什么字符分割")

把字符串分割为字符串数组。

例,

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var str="Visit W3School!"
window.alert(str.search(/W3School/));//6 function test() {
var con = content.innerText;
var myReg = /abc/gi;
res = con.match(myReg);
for (var i = 0; i < res.length; i++) {
window.alert(i+" "+res[0]);
}
} function test1() {
var con = content.innerText;
var myReg = /(\d){4}/gi;
//把四个数字换成 这里原来是四个数
//var newCon = con.replace("/(\\d){4}/", "这里原来是四个数");
var newCon = con.replace(myReg, "这里原来是四个数");
content.innerText = newCon;
} </script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea><br/>
<input type="button" onclick="test()" value="测试" />
<input type="button" onclick="test1()" value="替换" />
</body>
</html>

   RegExp对象的属性

RegExp对象属性分为静态属性和实例属性,所谓静态属性是指:可以通过RegExp就可以访问。所谓实例属性是指:通过RegExp对象实例才能访问使用。

 RegExp有哪些静态属性

①index:是当前表达式模式首次匹配内容的开始位置,从0开始计数,其初始值为-1,每次成功匹配时,index属性都会随之改变。

②lastIndex:是当前表达式模式首次匹配内容中最后一个字符的下一个位置,从0开始计数。

③input:返回当前所作用的字符串。

④leftContext:是当前表达式模式最后一个匹配字符串左边的所有内容。

⑤rightContext:是当前表达式模式最后一个匹配字符串右边的所有内容。

静态属性index/leftContext/rightContext的使用示例:

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
//index leftContext rightContext
function test() {
var con = content.innerText;
var myReg = /(\d){4}/gi;
while(res = myReg.exec(con)) {
window.alert("index = " + RegExp.index+" left = "+RegExp.leftContext
+" right = "+RegExp.rightContext);
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea><br/>
<input type="button" onclick="test()" value="测试" />
</body>
</html>

特别注意:RegExp静态属性的使用方式为:RegExp.属性名

   正则表达式的语法--子表达式、捕获、反向引用

子表达式、捕获、反向引用

如果你认为正则表达式只能检索固定的字符串或是连续的几个数字,那你就太小看正则表达了。

案例:给你一个字符串(或一篇文章),请你找出所有四个数字连在一起的子串,并且这四个数字要满足1、第一位与第四位相同;2、第二位与第三位相同,比如1221,5775,...

代码如下:

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function test() {
var con = content.innerText;
var myReg = /(\d)(\d)\2\1/gi;//()包起来为子表达式,\2反向引用第二个子表达式,\1反向引用第一个子表达式
while(res = myReg.exec(con)) {
window.alert(res[0]);
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea><br/>
<input type="button" onclick="test()" value="测试" />
</body>
</html>

图示:

案例:查找aabbccdd格式的数字

代码如下:

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function test() {
var con = content.innerText;
var myReg = /(\d)\1(\d)\2(\d)\3(\d)\4/gi;
while(res = myReg.exec(con)) {
window.alert(res[0]);
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea><br/>
<input type="button" onclick="test()" value="测试" />
</body>
</html>

案例:找出abbba规则的数字

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function test() {
var con = content.innerText;
var myReg = /(\d)(\d)\2\2\1/gi;
while(res = myReg.exec(con)) {
window.alert(res[0]);
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea><br/>
<input type="button" onclick="test()" value="测试" />
</body>
</html>

案例:12321-444999111前5个任意数字后9个数要按规则来写

<!DOCTYPE html>
<htmL>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function test() {
var con = content.innerText;
var myReg = /(\d){5}-(\d)\2\2(\d)\3\3(\d)\4\4/gi;
while(res = myReg.exec(con)) {
window.alert(res[0]);
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea><br/>
<input type="button" onclick="test()" value="测试" />
</body>
</html>

正则表达式的语法--元字符详解

   元字符

如果要想灵活的运用正则表达式,必需了解其中各种元字符的功能,元字符从功能上大致分为:

  1. 限定符
  2. 选择匹配符
  3. 分组组后和反向引用符
  4. 特殊字符
  5. 字符匹配符
  6. 定位符

元字符--限定符

用于指定其前面的字符和组合项连续出现多少次。

{n}说明:n表示出现的次数。比如a{3},1{4},(\d){2}。

但是这里要注意一点,1{3}去匹配1111111的话,会是到什么结果呢?答案是:111    111。

{n,m}说明:表示至少出现n次最多m次。比如a{3,4},1{4,5},(\d){2,5}。

我们看看1{3,4}去匹配1111111的话,会得到什么结果呢?答案是:1111   111。

js在默认匹配中使用的是贪婪匹配的原则,即尽可能匹配多的字符串。

+说明:+表示出现1次到任意多次。比如/a+/gi,/1+/gi,/(\d)+/gi。

看看/1+/gi去匹配1111111的话会得到什么结果呢?答案是:1111111。

*说明:*表示出现0次到任意多次。比如/a*/gi,/1*/gi,/(\d)*/gi。

看看/a1*/gi去匹配a111的话会得到什么结果呢?答案是:a111。

?说明:?表示出现0次到1次。比如/a?/gi,/1?/gi,/(\d)?/gi。

看看/a1?/gi去匹配a111的话会得到什么结果呢?a1。

 元字符--字符匹配符

[a-z]说明:[a-z]表示可以匹配a-z中任意一个字符。比如:/[a-z]/gi,/[a-z]{2}/gi。

看看/[a-z]/gi去匹配allc8会得到什么结果?答案是:a l l c。

[A-Z]表示可以匹配A-Z中任意一个字符。

[0-9]表示可以匹配0-9中任意一个字符。

[^a-z]说明:[^a-z]表示可以匹配不是a-z中的任意一个字符。比如/[^a-z]/gi,/[^a-z]{2}/gi。

看看/[a-z]/gi去匹配allc8会得到什么结果?答案是:a l l c;用/[^a-z]{2}/gi又会得到什么结果?答案是得不到任何结果;用/[^a-z]/gi又会得到什么结果?答案是:8。

[^A-Z]表示可以匹配不是A-Z中任意一个字符。

[^0-9]表示可以匹配不是0-9中任意一个字符。

[abcd]表示可以匹配abcd中的任意一个字符。

[^abcd]表示可以匹配不是abcd中的任意一个字符。 当然上面的abcd你可以根据实际情况修改,以适应你的需求。

\d 表示可以匹配0-9的任意一个数字,相当于[0-9]
\D 表示可以匹配不是0-9中的任意一个数字,相当于[^0-9]
\w 表示匹配任意英文字符、数字、下划线,相当于[a-zA-Z0-9_]
\W 相当于[^a-zA-Z0-9_],与\w刚好相反
\s 表示匹配任何空白字符(空格、制表符等)
\S 表示匹配任何非空白字符,和\S刚好相反
. 表示匹配除\n之外的所有字符,如果要匹配本身则需要使用\.

思考题:写一个正则表达式可以匹配任意三个连续的字符。

/([\d\D])\1{2}/gi;

   元字符--特殊字符匹配

在字符中,可能你会遇到比较特殊的字符,针对这种情况,正则表达式通过\xn的方式来匹配\xn的x是固定的,n是一个十六进制的数,比如\x21就是去匹配ascii码表中十六进制是21的字符,查表可知就是!。

 元字符--定位符

定位符用于规定要匹配的字符串出现的位置,比如在字符串的开始还是在结束的位置,这个也是相当有用的,必须掌握。

^符号说明:匹配目标字符串的开始位置。

比如/^han/gi去匹配"hanshunping han han",看看会得到什么结果?答案是:han。(在开始处出现匹配的字符串才会得到值)。

   $符号说明:匹配目标字符串的结束位置。

比如/han$/gi去匹配"hanshunping han han",看看会得到什么结果?答案是:han。(在结尾处出现匹配的字符串才会得到值)。

\b符号说明:匹配目标字符串的边界。

这个字符串的边界,有点不好理解,举例说明:

比如/han\b/gi去匹配"hanshunping sphan nnhan",我们会匹配到"hanshunping sphan nnhan",所以这里说的字符串的边界指的是子串间有空格,或者是目标字符串的结束位置,特别注意:没有目标字符串的开始位置。

\B符号说明:匹配目标字符串的非边界。

这个和\b含义刚刚相反,不再赘述。看案例:

比如/han\B/gi去匹配"hanshunping sphan nnhan",会匹配到"hanshunping sphan nnhan"。

特别说明:\B和\b用到的特别少,而且我也懵逼了,干脆不用!

元字符--转义符号\

\符号说明:在我们使用正则表达式去检索某些特殊字符的时候,需要用到转义符号,否则检索不到结果,甚至会报错。

案例:

用/(/gi去匹配"abc$("会怎样?答案是报错。

需要用到转义符号的字符有以下:

. * + ( ) $ / \ ? [ ] ^ { }

   元字符--选择匹配符

有时候,在匹配某个字符串的时候是选择性的,即:既可以匹配这个,又可以匹配那个,这时需要用到选择匹配符号|。

选择匹配符号还是比较好理解的,案例说明:

用/(han|韩)/gi去匹配"hanshunping 韩顺平",会得到什么结果?答案是:han 韩。

案例:给你一个字符串,请你验证该字符串是否是一个电子邮件?

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function test() {
var con = content.innerText;
var myReg = /^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/;
if(myReg.test(con)) {
window.alert("是邮件");
} else {
window.alert("不是邮件");
}
}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea>
<input type="button" onclick="test()" value="检索" />
</body>
</html>

一个极极极简单的二代身份证验证案例。

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>二代身份证验证</title>
<script type="text/javascript">
function idCard() {
//area为对象名,前面的数字为属性名,后面的字符串为属性值(搞的我认为是数组)
area = { 11: "北京", 12: "天津", 13: "河北", 14: "山西", 15: "内蒙古",
21: "辽宁", 22: "吉林", 23: "黑龙江", 31: "上海", 32: "江苏",
33: "浙江", 34: "安微", 35: "福建", 36: "江西", 37: "山东",
41: "河南", 42: "湖北", 43: "湖南", 44: "广东", 45: "广西",
46: "海南", 50: "重庆", 51: "四川", 52: "贵州", 53: "云南",
54: "西藏", 61: "陕西", 62: "甘肃", 63: "青海", 64: "宁夏",
65: "新疆", 71: "台湾", 81: "香港", 82: "澳门", 91: "国外", };
var idInfo = idNumber.value;
//正则表达式,我已懵逼了
var idReg = /^[1-9]\d{5}[1-2](9|0)\d\d[0-1]\d[0-3]\d{4}(\d|x)$/;
//判断输入的ID长度和格式是否正确
if(!idReg.test(idInfo) || idInfo == "") {
alert("不能为空或输入有误!请核实后重新输入!");
} else {
//通过地区码判断ID号是否非法
var myArea = idInfo.substring(0, 2);
//只判断了开始的2位地区码省份,有兴趣的朋友可以添加市及县的判断
//对象名['属性名']访问该对象中的属性
if(area[parseInt(myArea)] == null) {
alert("非法二代身份证!");
return;
}
//取出性别
var mySex = idInfo.substring(16, 17);
//取出生日
var myDate = idInfo.substring(6, 14);
alert("身份证号码:"+idInfo+" 籍贯所在地:"+area[parseInt(myArea)]+
" 性别:"+(mySex%2 ? "男" : "女")+" 生日:"+myDate);
}
}
</script>
</head>
<body>
<input id="idNumber" type="text" />
<input type="button" value="二代身份证验证" onclick="idCard()" />
</body>
</html>

正则表达式(RegExp)的更多相关文章

  1. javascript类型系统——正则表达式RegExp类型

    × 目录 [1]对象 [2]实例属性 [3]静态属性[4]实例方法 前面的话 前面已经介绍过javascript中正则表达式的基础语法.javascript的RegExp类表示正则表达式,String ...

  2. JavaScript学习笔记-正则表达式(RegExp对象)

    正则表达式(RegExp对象)   1.正则表达式字面量,在脚本加载后编译.若你的正则表达式是常量,使用这种方式可以获得更好的性能,重复使用时不会重新编译: 2.使用构造函数创建的RegExp,提供了 ...

  3. JavaScript数据类型 正则表达式RegExp类型

    前言 上一篇文章已经介绍了正则表达式的基础语法.javascript的RegExp类表示正则表达式,String和RegExp都定义了方法,使用正则表达式可以进行强大的模式匹配和文本检索与替换.本文将 ...

  4. JavaScript -- 时光流逝(六):js中的正则表达式 -- RegExp 对象

    JavaScript -- 知识点回顾篇(六):js中的正则表达式 -- RegExp 对象 1. js正则表达式匹配字符之含义      查找以八进制数 规定的字符.     查找以十六进制数 规定 ...

  5. JavaScript 正则表达式RegExp 和字符串本身的正则表达式

    JavaScript 正则表达式 正则表达式(英语:Regular Expression,在代码中常简写为regex.regexp或RE)使用单个字符串来描述.匹配一系列符合某个句法规则的字符串搜索模 ...

  6. VBScript: 正则表达式(RegExp对象)

    RegExp对象是VBScript中用于提供简单地正则表达式支持的对象.VBScript中所有和正则表达式有关的属性和方法都有这个对象有关联. 一.RegExp对象的属性和方法(三个属性,三个方法) ...

  7. javascript正则表达式 —— RegExp 对象

    定义 RegExp RegExp 对象用于存储检索模式. 通过 new 关键词来定义 RegExp 对象.以下代码定义了名为 patt1 的 RegExp 对象,其模式是 "e": ...

  8. 从javaScript中学习正则表达式——RegExp

    正则表达式工具:http://regexper.com   由于国外网络可以选择 https://github.com/javallone/regexper-static 离线安装作为本地服务. 正则 ...

  9. js 中的正则表达式RegExp

    1.RegExp对象 1.1 RegExp对象实例的创建 正则表达式模式:     g:表示全局模式,即模式将被用于整个字符串,而非发现第一个匹配项时立即停止:     i:表示不区分大小写,忽略大小 ...

随机推荐

  1. PHP读取CSV文件把数据插入到数据库,本地没有问题,阿里云测试服务器不行

    原因是 本地windows和服务器linux编码不同,在代码中不要加编码转换的内容,而是把csv文件另存为utf-8文件上传就可以了,windows和Linux都就可以了. html代码: PHP端代 ...

  2. asp.net MVC上传图片完整方法

    图片上传 自动创建文件夹并重命名(带缩略图) 后台: [HttpPost] public ActionResult WanSell_UploadPicture(ProductGalleryModels ...

  3. Mysql基础3

    一.客户管理系统CRUD二.大数据分页web页面1.MySQL:分页语句limitSELECT * FROM customer LIMIT m,n;m:代表开始记录的索引.从0开始n:一次取多少条 每 ...

  4. centos创建监控宝采集器及添加插件任务

    官方的说明文档很不详细操作也有点小问题,故把操作记录如下. 操作系统环境: centos 5.8 python 2.4.3 创建采集器等操作这里就不说了,见官方文档:http://blog.jiank ...

  5. Linux kill -9 和 kill -15 的区别

    “我的天呀!”,网页编辑没有自动保存草稿的功能.害的我昨天写的东西都没有了.算了,不计较这些了.反正也没写多少. 嘻嘻. 大家对kill -9 肯定非常熟悉,在工作中也经常用到.特别是你去重启tomc ...

  6. div有最小高度且自适应高度

    DIV最小高度且自适应高度   在IE6中,如果子容器的高度超过父容器的时候,父容器会被子容器撑开,所以我们可以直接设置一个height的高度值即可.但是在IE7和firefox就不行了,它不会自动撑 ...

  7. SQLite-CONSTRAINTS(约束)

    SQLite – CONSTRAINTS(约束) 约束是数据列在表上执行的规则.这些是用来限制的数据类型可以进入一个表.这样可以确保数据的准确性和可靠性在数据库中. 级或表级约束可以列.列级约束是仅适 ...

  8. Tomcat配置一个ip绑定多个域名

    在网上找了半天也没找到相关的资料,都说的太含糊. 本人对tomcat下配置 一ip对多域名的方法具体例如以下,按以下配置一定能成功,经过測试了. <Host name="localho ...

  9. qt study2

  10. CCPC-Winter Camp div2 day8 A

    ---恢复内容开始--- 题目: 题解: 我们考虑第i个叶子节点的情况,根据题目给的输入条件,我们可以知道,深度大的节点的序号一定是大于深度浅的节点的序号的 如图 题目要求我们找出每一个叶子节点距离编 ...