Javascript的正则表达式,不能不说方便,简简单单“//”就可以声明一个RegExp对象,配合编辑器的颜色渲染,实在让人舒心。但过于方便的东西,必然也会有一些瑕疵需要我们去注意。

首先要说的是使用RegExp对象来声明正则,因为他是除了eval之外,唯一能将字符串转化为正则对象的方法。但在使用的时候,如果你长时间没写JavaScript,那么很容易将他的参数和上面的“//”混淆。使用RegExp需要注意两点:1、第一个参数只能是正则的内容,并且不包含起始和结束符“/”,修饰符应写在第二个参数里;2、正则表达式的内容需要使用“\”转义的,必须考虑到字符串的转义字符也是“\”,然后……你懂的,代码就显得不那么优美了。

考虑到工作的需要,可以封装一个函数,快速将字符串的正则通过RegExp转化为正则表达式对象。

再来说说'g'修饰符给我们挖的深坑:

为了优化JavaScript的性能,在编码过程中,一般都会对反复使用的RegExp对象进行缓存。而有时候,为了代码整体性的美观(例如:同时使用到test和replace,并且replace必须要加“g”修饰符的时候,为了不重写正则,同时减少缓存的变量),一些调用test的正则表达式也会加上“g”修饰符,然后问题就出现了:

在Chrome中尝试运行如下代码

PS:后面的三代码,是针对错误的三种解决方案

究其原因,还是lastIndex这个参数导致的。由于`g`修饰符会触发RegExp对象使用lastIndex变量缓存上一次匹配成功的位置,而这一属性与字符串参数无关。中途更换字符串不能触发重置lastIndex的操作,只有匹配失败之后,才会重置。

感谢1楼 Suprise 给出的解答

JavaScript正则表达式的坑很深的更多相关文章

  1. javascript正则表达式入门先了解这些

    前言 此内容由学习<JavaScript正则表达式迷你书(1.1版)>整理而来(于2020年3月30日看完).此外还参考了MDN上关于Regex和String的相关内容,还有ECMAScr ...

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

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

  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正则表达式的语法,有了这些基本知识,可以看看正则表达式在JavaScript的应用了,在一切开始之前,看看RegExp实 ...

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

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

  8. javascript正则表达式(一)——语法

    前言 js中类RegExp类表示正则表达式,具有强大的模式匹配.文本检索和替换功能.正则表达式的模式规则是由一个字符序列组成,包括所有字母和数字在内,大多数的字符都是按照直接量匹配字符,某些特殊字符并 ...

  9. 5分钟教你学会JavaScript正则表达式

    正则表达式在实际开发过程中和技术面试过程中的重要性不言而喻,本文仅仅只是教你如何在几分钟之类学会正则表达式,对于它的原理及运行机制不做介绍. 第一:什么是正则 正则表达式是一种用来描述一定数量文本的模 ...

随机推荐

  1. Swift语言指南(七)--语言基础之布尔值和类型别名

    原文:Swift语言指南(七)--语言基础之布尔值和类型别名 布尔值 Swift有一个基本布尔类型,叫做布尔(bool),布尔值又称逻辑值(logical),因为它只能为真(true)或假(false ...

  2. HDU 5055 Bob and math problem(结构体)

    主题链接:http://acm.hdu.edu.cn/showproblem.php?pid=5055 Problem Description Recently, Bob has been think ...

  3. WebBrowser编程简述

    原文:WebBrowser编程简述 1.初始化和终止化(Initialization & Finalization) 大家在执行TWebBrowser的某个方法以进行期望的操作,如ExecWB ...

  4. Swift编程语言学习12 ——实例方法(Instance Methods)和类型方法(Type Methods)

    方法是与某些特定类型相关联的函数.类.结构体.枚举都能够定义实例方法:实例方法为给定类型的实例封装了详细的任务与功能.类.结构体.枚举也能够定义类型方法:类型方法与类型本身相关联.类型方法与 Obje ...

  5. 萧墙HTML5手机发展之路(51)——jquerymobile在提高页面访问速度

    正在使用jQuery Mobile开发时间可以选择单页模板和多页模板,在单页模板时从一个页面跳转到另一个页面时从需要server要求.用户会感到轻微的停顿. 使用多页模板,为了改善网页之间跳跃的流畅, ...

  6. linux监控命令全覆盖(图文说明)

    1.1 top 1.1.1 命令说明 Top 命令能够实时监控系统的运行状态,并且可以按照cpu.内存和执行时间进行排序 1.1.2 参数说明 命令行启动参数: 用法: top -hv | -bcis ...

  7. appserv+win8

    在win8系统安装appserv后,假设apache2服务不安装成功,在安装文件夹Apache2.2手动执行apache_servicefix.bat要么apache_serviceinstall.b ...

  8. 在VirtualBox下安装CentOS教程(截图版)

    http://blog.csdn.net/kobe_lzq/article/details/7894718 使用的软件: VirtualBox 4.1.2 CentOS 5.6 x86_64  刻录的 ...

  9. Best JavaScript Tools for Developers

    JavaScript solves multiple purposes; it helps you to create interactive websites, web applications, ...

  10. js判断浏览器类型(手机和电脑终端)

    工作中经常会用到通过js来判断浏览器的功能!今天这里通过js来判断浏览器是来自移动设备还是pc设备! 代码如下: var browser={ versions:function(){ var u = ...