正则表达式在实际开发过程中和技术面试过程中的重要性不言而喻,本文仅仅只是教你如何在几分钟之类学会正则表达式,对于它的原理及运行机制不做介绍。

第一:什么是正则

  正则表达式是一种用来描述一定数量文本的模式,用来匹配相同规范样式的文本。在JavaScript中用RegExp对象表示正则表达式( 即Regular Eexpression),它是对字符串执行模式匹配的强大工具。我们可以参看W3C所给的说明。

 

第二:创建一个正则表达式

  在JavaScript中创建正则表达式,有2种方式,隐式显式创建。 (gi 后文会给出解释)

  隐式创建:

 var regExp=/正则表达式/gi;  

  显式创建:

 var regExp=new RegExp("正则表达式","gi");

  由两种创建方式我们已经知道了正则表达式的基本构建方法。即 /正则表达式/gi;

在具体介绍正则表达式的使用细则及语法之前,我们先来学习JavaScript中RegExp类的两个方法,以方便我们后文的代码讲解,更多方法参看W3C文档。

  ①match:找到一个或多个正则表达式的匹配。

    W3C所给的解释为match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。该方法类似 indexOf() 和 lastIndexOf(),但是它返回指定的值,而不是字符串的位置。

  ②replace:

    replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

鉴于RegExp方法较多,此处我们暂列两个,方便后文使用。

第三:语法详解

  我会根据循序渐进的方式帮助大家理解正则的具体语法,提出问题,然后代码解决。

  ①匹配字符串中是否存在abc字符串,并返回

    正则表达式 /abc/gi

代码:

 var content=id.innerText;         // 获取需要匹配的字符串内容
var myreg=/abc/gi; // 正则表达式
res=content.match(myreg);
for(var i=0;i<res.length;i++){
window.alert(i+" "+res[0]); // res详情参考W3C文档
}

  由上可以知道,我们若要匹配某个具体的字符串,只需在两个 / 字符之间写入匹配的字符串。

  ②匹配 1221、112233、010-11223344 形式的字符串

当需要匹配上述字符串时,我们采用第一种方法已经不能适用。在讲述新方法之前,先讲解如何匹配数字表示和反向引用的一些粗浅知识。

  匹配数字我们用\d表示,在JavaScript正则表达式中用()包括起来的内容是一个子表达式,如:\(\d)(\d)\gi 其中第一个括号表示第一个子表达式,第二个括号表示第二个子表达式。现在给出1221的正则表达式,为

/(\d)(\d)\2\1/gi;   // 1221  2334  5667 类似格式的数字

  上述\2\1大家不理解什么意思,这就要牵涉反向引用的概念了,\2表示匹配的是和第二个子表达式的相同的内容(即在此处第二个数和第三个数相同),\1表示匹配的是和第一个子表达式的相同的内容(即在此处第一个数和第四个数相同)。

  当我们理解了反向引用的概念后,匹配后面2个格式的表达式就很轻松了。

  112233格式:

/(\d)\1(\d)\2(\d)\3/gi;      // 112233  334422 类似格式的数字

  010-11223344格式:

/(\d){3}-(\d)\2(\d)\3(\d)\4(\d)\5/gi;        

  该正则表达式,(\d){3}表示为3个数字。

  例子:

    若我们用1{3}匹配1111111会得到多少什么结果?用1{3,4}匹配1111111会得到什么结果?编写程序证实你的猜想。({3,4}表示匹配至少3个,至多4个)

看到此处,希望读者能够运用我上述所讲的方法,证实自己的猜想,因为里面牵涉JavaScript正则匹配的两个规则。

    答案:

      1{3}匹配1111111得到111  111。这是因为正则匹配的时候,当匹配到一个字符串时,会自动从下一个字符开始匹配。

      1{3,4}匹配1111111得到1111  111。JavaScript匹配的时候遵循一个贪婪原则,即尽可能匹配多的,当多的匹配不满足时,才退而求其次,在此处若能匹配到1111则会先匹配4个1,匹配不到则匹配111。

  ③+、*、?讲解

    +:表示匹配1次到任意多次

    如:

/a+/gi;             // 匹配 a一个至多个
/(\d)+/gi; // 匹配 数字一个至多个

    *:表示匹配0次到任意多次

    如:

/a*/gi;
/(\d)*/gi;
/a1*/gi; // 若匹配a111 得到a111

    ?:表示匹配0次到1次

/a1?/gi;              // 若匹配a111  得到a1

  ④{}、[]、^、$ 讲解

    {}:上文已经提及,表示具体量

    []: 表示范围

    如:

/[a-z]/gi;                       // 匹配 a到z  的任意1个字符,等价于/[a-z]{1}/gi
/[a-z]{2}/gi; // 匹配 a到z 的任意2个字符

    ^:表示“匹配目标字符串的开始位置”,若此字符若位于[]括号内,表示“否定”的意思

    如:

/[^a-z]/gi;              // 不是a到z的任意一个字符
/[^0-9]/gi;    // 不是0到9的任意一个字符
/^[a-zA-Z0-9]{2}/gi; // 以数字或者字母开头的2个字符

    $:表示“匹配目标字符串的结束位置”

  ⑤其他字符表示

    \D :\d的反面,匹配非数字 ,即等价于[^0-9]

    \w :匹配任意英文字符

    \W:\w的反面,匹配非英文字符 ,即等价于 [^a-zA-Z0-9_]

    \s  :  匹配任何空白字符(空格,制表符等)

    \S :\s的反面,即匹配任何非空白字符

    .   : 匹配出 \n 之外的所有字符,如果要匹配,匹配自己则需要使用 \. (即匹配. 为/\./gi)

  ⑥需要转义的字符:

    正如⑤中的 . 所示,当需要匹配 . 的时候,我们需要加上转义字符。总结一下,JavaScript中匹配字符需要用到转义字符的有。 

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

  ⑦选择匹配符 |

    在正则匹配的时候,有时需要匹配多个正则表达式,此时则需要用到选择匹配符|,可以看做是编程中“或”的意思

    如:

/[a-z]{3}|[A-Z]{2}/g;           // 匹配a到z的3个字符或者是A到Z的2个字符都可

第四:最后补充

  讲解一下正则表达式中gi所表达的意思。之所以放在文章最后,是为了帮助大家直接了解正则有关的内容,更快的方式来使用它。

gi是RegExp类中的实例属性:其实有gims四个,其中:

  g: global之意,表示全局匹配

  i:  ignoreCase之意,表示忽略大小写

  m: multiple之意,表示多行匹配,即考虑换行这个因素,即匹配时将换行后的字符串当作新的一个字符串匹配

  s: source之意,表示返回创建RegExp对象实例时指定的表达式文本字符串

正则匹配时根据需要填写相应的属性。

  最后,希望这篇文章能够真正帮助到那些正则学习正则表达的人们,小白一枚,粗浅言论,希望大家勿喷。

  给大家一个js验证表单的网址,里面有一些正则表达式验证,可以学学稳固一下知识:http://www.jb51.net/article/4976.htm

5分钟教你学会JavaScript正则表达式的更多相关文章

  1. 10分钟 教你学会Linux/Unix下的vi文本编辑器

    10分钟 教你学会Linux/Unix下的vi文本编辑器 vi编辑器是Unix/Linux系统管理员必须学会使用的编辑器.看了不少关于vi的资料,终于得到这个总结.不敢独享,和你们共享. 首先,记住v ...

  2. 【原创】三分钟教你学会MVC框架——基于java web开发(1)

    MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用于组织代码用一种业务逻辑和数据显示分离的方法. ...

  3. Docker虚拟化管理:30分钟教你学会用Docker

    关于Docker的官方介绍网上太多了我就不贴了,就实际体验来说Docker可以极大的简化环境搭建及服务部署的操作流程,大大降低部署的时间成本,解放你的双手. 本文不会深入讲解Docker底层架构及运行 ...

  4. 【原创】三分钟教你学会MVC框架——基于java web开发(2)

    没想到我的上一篇博客有这么多人看,还有几位看完之后给我留言加油,不胜感激,备受鼓励,啥都别说了,继续系列文章之第二篇.(如果没看过我第一篇博客的朋友,可以到我的主页上先浏览完再看这篇文章,以免上下文对 ...

  5. 5分钟教你学会Django系统错误监控

    一.监控所有的request请求 如何实现系统监控,自动发送错误日志的邮件呢? 只需配置配置settings文件即可. 1.设置发送邮件配置信息 邮件会发送到ADMINS设定的邮件列表中. SERVE ...

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

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

  7. 正则表达式入门教程&&经典Javascript正则表达式(share)

    前言 例子: ^.+@.+\\..+$ 这样的代码曾经多次把我自己给吓退过.可能很多人也是被这样的代码给吓跑的吧.继续阅读本文将让你也可以自由应用这样的代码. 正文 教程:正则表达式30分钟入门教程 ...

  8. 自己实现的一款在线Javascript正则表达式测试器——JRE-Parser

    本文最初发布于我的个人博客:http://jerryzou.com/posts/jreparser/ 昨天在看<正则表达式30分钟入门教程>的时候,看到博主自己实现了一个C#写的正则测试器 ...

  9. JavaScript 正则表达式基础语法

    前言 正则表达式在人们的印象中可能是一堆无法理解的字符,但就是这些符号却实现了字符串的高效操作.通常的情况是,问题本身并不复杂,但没有正则表达式就成了大问题.javascript中的正则表达式作为相当 ...

随机推荐

  1. windows2012R2虚拟机快速激活的方法

    相信Hyper-v管理员都有这样的经历,安装多台虚拟机后,都要一台一台手工激活,如果虚拟机足够多的话,这是一项很繁琐的工作,但从Windows Server 2012 R2开始,就不需要这么做了,微软 ...

  2. Android ViewFlow的一个例子

    完成这个例子的步骤: 1.下载ViewFlow的源码,然后将类ViewFlow放在自己的工程的src的某个包下. 2.下载的源码里有2个工程view flow,viewflow-example.将vi ...

  3. Nmap扫描教程之DNS服务类

    Nmap扫描教程之DNS服务类 Nmap DNS服务类 DNS(Domain Name System,域名系统)的作用就是将主机名解析为相应IP地址的过程. 通常主机域名的一般结构为:主机名.三级域名 ...

  4. AngularJS clone directive 指令复制

    需求背景:         directive模块化某表单信息,但表单信息可加入多条.此时就涉及到clone directive. 解决方式:         能够通过使用angularjs中$com ...

  5. linux groupmems命令

    Because users group membership is defined in two different locations, it can be difficult to find ou ...

  6. sql server 性能计数器

    常规计数器 收集操作系统服务器的服务器性能信息,包括Processor.磁盘.网络.内存 Processor 处理器 1.1 % Processor Time指处理器用来执行非闲置线程时间的百分比.通 ...

  7. mui实现自动登录

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name= ...

  8. html01基本标签

    01. <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8 ...

  9. Windows离线安装.NET3.X

    Windows离线安装.NET3.X 当我们在Windows上安装软件的时候,总是会提示需要安装.NET3.X.而大多数人们选择在线安装,这样会很慢,不少人想到了离线安装的方式.其是只要你的电脑是Wi ...

  10. Config配置文件读写

    config文件读写操作(文字说明附加在程序中) App.config文件 <?xml version="1.0" encoding="utf-8" ?& ...