js 正则表达式

转自:http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/001434499503920bb7b42ff6627420da2ceae4babf6c4f2000

字符串是编程时涉及到的最多的一种数据结构,对字符串进行操作的需求几乎无处不在。比如判断一个字符串是否是合法的Email地址,虽然可以编程提取 @前后的子串,再分别判断是否是单词和域名,但这样做不但麻烦,而且代码难以复用。

正则表达式是一种用来匹配字符串的强有力的武器。它的设计思想是用一种描述性的语言来给字符串定义一个规则,凡是符合规则的字符串,我们就认为它”匹配”了,否则,该字符串就是不合法的。

所以我们判断一个字符串是否是合法的Email的方法是:

因为正则表达式也是用字符串表示的,所以,我们要首先了解如何用字符来描述字符。

在正则表达式中,如果直接给出字符,就是精确匹配。用 \d可以匹配一个数字, \w可以匹配一个字母或数字,所以:

  • '00\d'可以匹配 '007',但无法匹配 '00A'
  • '\d\d\d'可以匹配 '010'
  • '\w\w'可以匹配 'js'

.可以匹配任意字符,所以:

  • 'js.'可以匹配 'jsp''jss''js!'等等。

要匹配变长的字符,在正则表达式中,用 *表示任意个字符(包括0个),用 +表示至少一个字符,用 ?表示0个或1个字符,用 {n}表示n个字符,用 {n,m}表示n-m个字符:

来看一个复杂的例子: \d{3}\s+\d{3,8}

我们来从左到右解读一下:

综合起来,上面的正则表达式可以匹配以任意个空格隔开的带区号的电话号码。

如果要匹配 '010-12345'这样的号码呢?由于 '-'是特殊字符,在正则表达式中,要用 '\'转义,所以,上面的正则是 \d{3}\-\d{3,8}

但是,仍然无法匹配 '010 - 12345',因为带有空格。所以我们需要更复杂的匹配方式。

要做更精确地匹配,可以用 []表示范围,比如:

  • [0-9a-zA-Z\_]可以匹配一个数字、字母或者下划线;
  • [0-9a-zA-Z\_]+可以匹配至少由一个数字、字母或者下划线组成的字符串,比如 'a100''0_Z''js2015'等等;
  • [a-zA-Z\_\$][0-9a-zA-Z\_\$]*可以匹配由字母或下划线、$开头,后接任意个由一个数字、字母或者下划线、$组成的字符串,也就是JavaScript允许的变量名;
  • [a-zA-Z\_\$][0-9a-zA-Z\_\$]{0, 19}更精确地限制了变量的长度是1-20个字符(前面1个字符+后面最多19个字符)。

A|B可以匹配A或B,所以 (J|j)ava(S|s)cript可以匹配 'JavaScript''Javascript''javaScript'或者 'javascript'

^表示行的开头, ^\d表示必须以数字开头。

$表示行的结束, \d$表示必须以数字结束。

你可能注意到了, js也可以匹配 'jsp',但是加上 ^js$就变成了整行匹配,就只能匹配 'js'了。

有了准备知识,我们就可以在JavaScript中使用正则表达式了。

JavaScript有两种方式创建一个正则表达式:

第一种方式是直接通过 /正则表达式/写出来,第二种方式是通过 new RegExp('正则表达式')创建一个RegExp对象。

两种写法是一样的:

<span class="keyword">var re1 = <span class="regexp">/ABC\-001/;
<span class="keyword">var re2 = <span class="keyword">new RegExp(<span class="string">'ABC\\-001');

re1; </span></span></span></span></span>

注意,如果使用第二种写法,因为字符串的转义问题,字符串的两个 \\实际上是一个 \

先看看如何判断正则表达式是否匹配:

var re = <span class="regexp">/^\d{3}\-\d{3,8}$/;
re.test(<span class="string">'010-12345'); <span class="regexp">// <span class="keyword">true
re.test(<span class="string">'010-1234x'); <span class="regexp">// <span class="keyword">false
re.test(<span class="string">'010 12345'); <span class="regexp">// <span class="keyword">false
</span></span></span></span></span></span></span></span></span></span>

RegExp对象的 test()方法用于测试给定的字符串是否符合条件。

用正则表达式切分字符串比用固定的字符更灵活,请看正常的切分代码:

<span class="string">'a b   c'.split(<span class="string">' '); <span class="regexp">// [<span class="string">'a', <span class="string">'b', <span class="string">'', <span class="string">'', <span class="string">'c']
</span></span></span></span></span></span></span></span>

嗯,无法识别连续的空格,用正则表达式试试:

<span class="string">'a b   c'.split(<span class="regexp">/\s+/); <span class="regexp">// [<span class="string">'a', <span class="string">'b', <span class="string">'c']
</span></span></span></span></span></span>

无论多少个空格都可以正常分割。加入 ,试试:

<span class="string">'a,b, c  d'.split(<span class="regexp">/[\s\,]+/); <span class="regexp">// [<span class="string">'a', <span class="string">'b', <span class="string">'c', <span class="string">'d']
</span></span></span></span></span></span></span>

再加入 ;试试:

<span class="string">'a,b;; c  d'.split(<span class="regexp">/[\s\,\;]+/); <span class="regexp">// [<span class="string">'a', <span class="string">'b', <span class="string">'c', <span class="string">'d']
</span></span></span></span></span></span></span>

如果用户输入了一组标签,下次记得用正则表达式来把不规范的输入转化成正确的数组。

除了简单地判断是否匹配之外,正则表达式还有提取子串的强大功能。用 ()表示的就是要提取的分组(Group)。比如:

^(\d{3})-(\d{3,8})$分别定义了两个组,可以直接从匹配的字符串中提取出区号和本地号码:

<span class="keyword">var re = <span class="regexp">/^(\d{3})-(\d{3,8})$/;
re.exec(<span class="string">'010-12345'); </span></span></span>

如果正则表达式中定义了组,就可以在 RegExp对象上用 exec()方法提取出子串来。

exec()方法在匹配成功后,会返回一个 Array,第一个元素是正则表达式匹配到的整个字符串,后面的字符串表示匹配成功的子串。

exec()方法在匹配失败时返回 null

提取子串非常有用。来看一个更凶残的例子:

<span class="keyword">var re = <span class="regexp">/^(0[0-9]|1[0-9]|2[0-3]|[0-9])\:(0[0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|[0-9])\:(0[0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|[0-9])$/;
re.exec(<span class="string">'19:05:30'); </span></span></span>

这个正则表达式可以直接识别合法的时间。但是有些时候,用正则表达式也无法做到完全验证,比如识别日期:

<span class="keyword">var re = <span class="regexp">/^(0[1-9]|1[0-2]|[0-9])-(0[1-9]|1[0-9]|2[0-9]|3[0-1]|[0-9])$/;
</span></span>

对于 '2-30''4-31'这样的非法日期,用正则还是识别不了,或者说写出来非常困难,这时就需要程序配合识别了。

需要特别指出的是,正则匹配默认是贪婪匹配,也就是匹配尽可能多的字符。举例如下,匹配出数字后面的 0

<span class="keyword">var re = <span class="regexp">/^(\d+)(0*)$/;
re.exec(<span class="string">'102300'); </span></span></span>

由于 \d+采用贪婪匹配,直接把后面的 0全部匹配了,结果 0*只能匹配空字符串了。

必须让 \d+采用非贪婪匹配(也就是尽可能少匹配),才能把后面的 0匹配出来,加个 ?就可以让 \d+采用非贪婪匹配:

<span class="keyword">var re = <span class="regexp">/^(\d+?)(0*)$/;
re.exec(<span class="string">'102300'); </span></span></span>

JavaScript的正则表达式还有几个特殊的标志,最常用的是 g,表示全局匹配:

<span class="keyword">var r1 = <span class="regexp">/test/g;
</span></span>

全局匹配可以多次执行 exec()方法来搜索一个匹配的字符串。当我们指定 g标志后,每次运行 exec(),正则表达式本身会更新 lastIndex属性,表示上次匹配到的最后索引:

<span class="keyword">var s = <span class="string">'JavaScript, VBScript, JScript and ECMAScript';
<span class="keyword">var re=<span class="regexp">/[a-zA-Z]+Script/g;

</span></span></span></span>

全局匹配类似搜索,因此不能使用 /^...$/,那样只会最多匹配一次。

正则表达式还可以指定 i标志,表示忽略大小写, m标志,表示执行多行匹配。

正则表达式非常强大,要在短短的一节里讲完是不可能的。要讲清楚正则的所有内容,可以写一本厚厚的书了。如果你经常遇到正则表达式的问题,你可能需要一本正则表达式的参考书。

检测邮箱格式是否合法:

Original: https://www.cnblogs.com/pengyingh/p/6924493.html
Author: pengyingh
Title: js 正则表达式

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/546204/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

  • 一步一步编译最新版Apache Doris 0.15版本的详细过程

    Apache Doris 于 2021 年 11 月 29 日迎来了 0.15.0 Release 版本的正式发布!有 99 位 Contributor 为 Apache Dori…

    技术杂谈 2023年6月1日
    084
  • MySQL随笔1

    MySQL随笔 ​ 国庆期间花一点时间刷了牛客和力扣的MySQL入门,两个网站的题目各有各的特色。不过最大的感触就是牛客的SQL题你都可以做,但力扣就只给你SQL入门里的题,其他专…

    技术杂谈 2023年7月11日
    089
  • 使用vscode对threejs的本地调试

    始终坚信阅读和调试结合的方式,才是学习开源的高效方法 一、老版本调试 遥想当年的threejs(使用版本为r75)还没有CommonJS,对于我这个小白可以拿起大刀大杀四方&#82…

    技术杂谈 2023年7月23日
    097
  • 微信白名单获取

    公司在微信WIFI登录项目中,需要在BRAS设备上添加微信服务器的IP地址到白名单列表中,以实现用户连接热点后,能够使用微信中的功能(如:添加公众号),但不能使用其他应用进行上网操…

    技术杂谈 2023年7月11日
    079
  • 日常白痴_Date的比较及增减操作

    一直以来,获取日期都是用new Date(),再不然,顶多用个SimpleDateFormat规范一下格式忽然遇到需求,需要对日期增加和比较大小的时候,就又懵住了,唉,每天都为自己…

    技术杂谈 2023年7月25日
    068
  • drawRect中抗锯齿

    在开始之前,我们需要创建一个DrawRectView 其初始代码为 // // DrawRectView.h // CGContextSetShouldAntialias // /…

    技术杂谈 2023年6月1日
    089
  • HashMap源码分析

    主要过一遍HashMap中的常量、构造方法、put方法(hash、putVal、resize) 当我们调用put时,实际上就是调用putVal public V put(K key…

    技术杂谈 2023年7月24日
    093
  • BeautifulSoup4库

    BeautifulSoup4库 和 lxml 一样,Beautiful Soup 也是一个HTML/XML的解析器,主要的功能也是如何解析和提取 HTML/XML 数据。 lxml…

    技术杂谈 2023年6月21日
    096
  • 22部漫威电影大合集和观影顺序

    【原文链接】:https://blog.tecchen.tech ,博文同步发布到博客园。由于精力有限,对文章的更新可能不能及时同步,请点击上面的原文链接访问最新内容。欢迎访问我的…

    技术杂谈 2023年7月10日
    078
  • java学习之springboot

    0x00前言 呀呀呀时隔好久我又来做笔记了,上个月去大型保密活动了,这里在网上看了一些教程如果说不是去做java开发我就不做ssm的手动整合了采用springboot去一并开发。S…

    技术杂谈 2023年6月21日
    097
  • CSS一个较为完整的页面布局_可以根据页面屏幕大小调整布局

    1 DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset=&q…

    技术杂谈 2023年7月24日
    080
  • Mac 睡眠唤醒 不睡眠 问题

    问题 之前一直有夜晚睡觉前电脑💻关机的习惯,主要是想着电脑也跟人一样♨️要休息😂。然后最近想着自己 Mac 干脆每天睡眠💤算了,省得每天开关机麻烦,所以就最近这段时间每次夜晚睡觉前…

    技术杂谈 2023年7月11日
    087
  • 安全通告 | 疑似PurpleFox多手段持续实施攻击活动

    安全通告 | 疑似PurpleFox多手段持续实施攻击活动 https://mp.weixin.qq.com/s/Fca_oOiL8oLiEUXGaErWjQ 搜索 复制 Orig…

    技术杂谈 2023年5月31日
    067
  • styleBinding样式存放位置

    styleBinding样式针对父层 放label里则只对label起作用 <ui> <view> <container> <subVie…

    技术杂谈 2023年6月1日
    0100
  • 如何实现共享屏幕标注功能?

    在视频会议系统中,经常会有这样的需求:参会人员A共享了自己的屏幕给大家观看,人员B则需要在屏幕图像上做标注,并且希望所有的与会人员都能看到他做的标注。 这个功能通常被称为共享屏幕标…

    技术杂谈 2023年6月1日
    090
  • chrome services and mojom

    Mojo is Chrome’s new IPC system and provides lots of useful abstractions. These abst…

    技术杂谈 2023年5月31日
    093
亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球