1.正则表达式的创建:

方法一:以字面量形式来创建
格式为/pattern/flags;其中pattern(模式)为任何简单或者复杂的表达式,可以包括字符类,限定符,分组,向前查找以及反向引用。每个正则表达式都可以有一个或者多个标识(flags),用以表明表达式的行为。正则表达式的匹配模式支持下列三个标识:

g:(global) 全局模式,即模式将应用于所有的字符串,而非发现第一个匹配项时立即停止;
i: (case-insensitive) 表示不区分大小写模式
m: (multiline)表示多行模式,即在文本的末尾时会继续查找下一行是否存在于模式匹配的项
用法如下:
匹配字符串所有的“at”:
 var pattern1 = /at/g;
匹配字符串第一个“at”:
var pattern2 = /[bc]at/i;
方法二:使用RegExp构造函数来创建
它接受两个参数: 一个是匹配的字符串模式,另一个是可选的标识字符串。
用法如下:
匹配第一个cat或者bat,不区分大小写:
var pattern = new RegExp("[bc]at", "i");
 
2.由于RegExp构造函数的模式的参数是字符串,所以某些情况下要对字符进行双重转义
 
所有元字符都要进行双重转义,那么那些已经转义过的字符也是如此。例如:\n(字符\在字符串中通常被转义为\\,而在正则表达式字符串中会变成\\\\)。下面给出一些模式,左边是字面量,右边是RegExp的
/\[bc\]at/;             "\\[bc\\]at";
/\.at/;                   "/\\.at/";
/name\/age/;         "/name\\/age/";
/\d.\d{1,2}/;        "\\d.\\d{1,2}";
/\w\\hello\\123/;       "\\w\\\\hello\\\\123";
 
3.字面量和构造函数创建正则表达式的区别
 
在ES3中,正则表达式字面量始终会共享一个RegExp实例,而使用构造函数创建的每一个新的RegExp实例都是一个新的实例。但是ES5之后,两者是没有这种区别的。
比如下面例子:
var re = null,
i;
for(var i = 0; i < 10; i++) {
re = /cat/g;
console.log(re.test("catastrophe")); } for(var i = 0; i < 10; i++) {
re = new RegExp("cat", "g");
console.log(re.test("catastrophe")); }
 
4.RegExp的实例属性
 
RegExp每个实例都具有下面的属性:
global: 布尔值,表示是否设置了g标识
ignoreCase: 布尔值,表示是否设置了i标识
multiline:布尔值,表示是否设置了m标识
lastIndex: 整数,表示开始搜索下个匹配项的字符串的位置,从0开始
source: 正则表达式的字符串表示,按照字面量的形式而非传入构造函数中的字符串模式返回
v

ar pattern1 = /\[bc\]at/i;
console.log(pattern1.global);//false
console.log(pattern1.ignoreCase);//true
console.log(pattern1.multiline);//false
console.log(pattern1.lastIndex);//0
console.log(pattern1.source); ///\[bc\]at/i var pattern2 = new RegExp("\\[bc\\]at", "i");
console.log(pattern2.global);
console.log(pattern2.ignoreCase);
console.log(pattern2.multiline);
console.log(pattern2.lastIndex);
console.log(pattern2.source);
我们注意到,第二个模式是使用构造函数,但是他们的source属性是相同的。可见,source属性保存的是规范形式的字符串,即字面量形式所使用的字符串。
 
5.捕获组
 
使用小括号指定一个子表达式后,匹配这个子表达式的文本(也就是此分组捕获的内容)可以在表达式或其它程序中作进一步的处理。默认情况下,每个捕获组会自动拥有一个组号,规则是:从左向右,以分组的左括号为标志,第一个出现的分组的组号为1,第二个为2,以此类推。
比如下面的例子:
var pattern = /mom (and dad (and baby)?)?/gi;
 
6.正则表达式的实例方法
 
1.exec(String testString);
该方法是专门为捕获组而设计的。它接受一个参数,即要应用到模式的字符串,然后返回包含第一个匹配项信息的数组;或者没有匹配项的情况下返回null.返回的数组虽然是Array实例,单包含两个额外的属性: index和input.其中index表示匹配项出现在字符串中的位置,而input表示应用正则表达式的字符串。在数组中,第一项是整个模式匹配的字符串,其他项是与模式中的捕获组匹配的字符串。(如果模式中没有捕获组,则该数组只包含一项)
var text = "mom and dad and baby";
var pattern = /mom (and dad (and baby)?)?/gi;
var matches = pattern.exec(text);
console.log(matches.index); //0
console.log(matches.input); //mom and dad and baby
console.log(matches[0]); //mom and dad and baby
console.log(matches[1]); //and dad and baby
console.log(matches[2]); //and baby
对于exec方法而言,即使在模式中设置了全局标识(g),它每次也只会返回一个匹配项,在不设置全局标识的情况下,在同一个字符串上多次调用exec将会返回第一个匹配项的信息。而在设置全局标志的情况下,每次调用exec则会在字符串中继续查找新的匹配项。如下面的例子:
    var text = "cat, bat, sat, fat";
var pattern1 = /.at/; var matches = pattern1.exec(text);
console.log(pattern1.lastIndex); //0
console.log(matches.index); //0
console.log(matches[0]); `//cat matches = pattern1.exec(text);
console.log(pattern1.lastIndex); //0
console.log(matches.index); //0
console.log(matches[0]); //cat var pattern2 = /.at/g; matches = pattern2.exec(text);
console.log(pattern2.lastIndex); //3
console.log(matches.index); //0
console.log(matches[0]); //cat matches = pattern2.exec(text);
console.log(pattern2.lastIndex); //8
console.log(matches.index); //5
console.log(matches[0]); //bat
2.test(String testString)
该方法接受一个字符串参数。在模式与该参数匹配的情况下,返回true,否则,返回false。要想知道目标字符串是否和某个字符串匹配,但不需要其文本内容的情况下,使用这个方法非常方便。因此,test经常用在if语句里。
如下面的例子:
var text = "000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/; if(pattern.test(text)) {
console.log("The pattern is matched");
}
RegExp实例继承的toLocaleString和toString方法都会返回正则表达式的字面量;与创建正则表达式的方式无关。例如:
var pattern = new RegExp("\\[bc\\]at", "gi");
console.log(pattern.toString());
console.log(pattern.toLocaleString());

输入都是:/\[bc\]at/gi

 
7.RegExp构造函数属性
RegExp构造函数包含了一些属性(称为静态属性)。这些属性使用于作用域中的所有正则表达式,并且基于所执行的最近一次正则表达式操作而变化。关于这些属性名的另一个特殊之处,就是可以通过两种方式访问他们。换句话说,这些属性分别有个长属性名和一个短属性名。下面给出了RegExp的构造函数的属性:
input                 $_  最近一次要匹配的字符串
lastMatch          $& 最近一次匹配项
lastParen         $+ 最近一次匹配的捕获组
leftContext         $` input字符串中lastMatch之前的文本
rightContext       $' input字符串中 lastMatch之后的文本
multiline             $* 布尔值,表示是否所有表达式都使用多行模式
 
例子如下:
var text = "this has been a short summer";
var pattern = /(.)hort/g; if(pattern.test(text)) {
console.log(RegExp.input); //this has been a short summer
console.log(RegExp.leftContext); //this has been a
console.log(RegExp.rightContext);// short summer
console.log(RegExp.lastMatch);//short
console.log(RegExp.lastParen);//s
console.log(RegExp.multiline);//false; }
如前所述,例子使用的长属性名都可以使用相应的短数学迷来代替。只不过这些短属性大多都不是有效的ES标识符,因此必须通过方括号语法来访问他们。如下所示:
var text = "this has been a short summer";
var pattern = /(.)hort/g; if(pattern.test(text)) {
console.log(RegExp.$_);
console.log(RegExp["$`"]);
console.log(RegExp["$'"]);
console.log(RegExp["$&"]);
console.log(RegExp["$+"]);
console.log(RegExp["$*"]);
}
 
RegExp构造函数除了以上几个属性之外,还有多达9个用于存储捕获组的构造韩事故属性。访问这些属性的语法是RegExp.$1, RegExp.$2...RegExp.$9,分别用于存储第一,2...9个匹配的捕获组。在调用exec或者test函数时,这些属性都会自动填充。然后,我们可以像下面这样使用他们。
var text = "this has a short summer";
var pattern = /(..)or(.)/g; if(pattern.test(text)) {
console.log(RegExp.$1); //sh
console.log(RegExp.$2); //t
console.log(RegExp.$3); //(空字符串)
}
 

http://www.cnblogs.com/yugege/p/4821016.html

JS前端正则表达式学习笔记(转)的更多相关文章

  1. Underscore.js 源码学习笔记(下)

    上接 Underscore.js 源码学习笔记(上) === 756 行开始 函数部分. var executeBound = function(sourceFunc, boundFunc, cont ...

  2. JavaScript正则表达式学习笔记(二) - 打怪升级

    本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...

  3. spring mvc 及NUI前端框架学习笔记

    spring mvc 及NUI前端框架学习笔记 页面传值 一.同一页面 直接通过$J.getbyName("id").setValue(id); Set值即可 二.跳转页面(bus ...

  4. 【09-23】js原型继承学习笔记

    js原型继承学习笔记 function funcA(){ this.a="prototype a"; } var b=new funcA(); b.a="object a ...

  5. Underscore.js 源码学习笔记(上)

    版本 Underscore.js 1.9.1 一共 1693 行.注释我就删了,太长了… 整体是一个 (function() {...}());  这样的东西,我们应该知道这是一个 IIFE(立即执行 ...

  6. javascript正则表达式 - 学习笔记

    JavaScript 正则表达式 学习笔记 标签(空格分隔): 基础 JavaScript 正则表达式是用于匹配字符串中字符组合的模式.在javascript中,正则表达式也是对象.这些模式被用于Re ...

  7. 浏览器中js执行机制学习笔记

    浏览器中js执行机制学习笔记 RiverSouthMan关注 0.0772019.05.15 20:56:37字数 872阅读 291 同步任务 当一个脚本第一次执行的时候,js引擎会解析这段代码,并 ...

  8. 纯JS实现KeyboardNav(学习笔记)一

    纯JS实现KeyboardNav(学习笔记)一 这篇博客只是自己的学习笔记,供日后复习所用,没有经过精心排版,也没有按逻辑编写 GitHub项目源码 预览地址 最终效果 KeyboardNav使用指南 ...

  9. 纯JS实现KeyboardNav(学习笔记)二

    纯JS实现KeyboardNav(学习笔记)二 这篇博客只是自己的学习笔记,供日后复习所用,没有经过精心排版,也没有按逻辑编写 这篇主要是添加css,优化js编写逻辑和代码排版 GitHub项目源码 ...

随机推荐

  1. Spring之AOP术语

    AOP是Aspect Oriented Programing的简称.被译为"面向切面编程". AOP独辟蹊径通过横向抽取机制为这类无法通过纵向继承体系进行抽象的反复性代码提供了解决 ...

  2. 修改系统启动项 grub2配置的方法 ubuntu[转]

    在 早期的Ubuntu中,使用Grub作为系统的启动引导程序,想修改系统启动项非常简单,只要用gedit打开系统菜单设定文件( sudo gedit /boot/grub/menu.lst ),修改该 ...

  3. win8.1 64位环境建设android开发环境

    1.下载JDK,http://www.oracle.com/technetwork/java/javase/downloads/index.html,选择版本号 2.安装刚刚下载的JDK 3.环境变量 ...

  4. 小米2S 中文和英文支持TWRP,真实双系统支持

    经过我几天的努力小米2S的TWRP 的功能已经完美了. 支持功能 : 中文和英文显示能相互切换 真实双系统功能已经完成95%. 刷入手机方法.由于时间原因我只制作了img文件.没有制作成卡刷包格式. ...

  5. CSS设计指南之定位

    原文:CSS设计指南之定位 CSS布局的核心是position属性,对元素盒子应用这个属性,可以相对于它在常规文档流中的位置重新定位.position属性有4个值:static.relative.ab ...

  6. BackGroundWorker使用总结

    方法: backgroundWorker1.CancelAsync() 用于取消异步执行 backgroundWorker1.ReportProgress(int ,object)用于向主线层报告进度 ...

  7. System.Threading.ThreadStateException

    异常:"System.Threading.ThreadStateException"在未处理的异常类型 System.Windows.Forms.dll 发生 其它信息: 在能够调 ...

  8. 排序算法门外汉理解-Shell排序

    #include <stdio.h> /* 希尔排序 基本思想:希尔排序又称为缩小增量排序,对简单插入排序的优化. (外部分组gap,组内部插入排序! ! ) 特点:一种不稳定的排序 */ ...

  9. android:强大的图像下载和缓存库Picasso

    1.Picasso一个简短的引论 Picasso它是Square该公司生产的一个强大的图像下载并缓存画廊.官方网站:http://square.github.io/picasso/ 仅仅须要一句代码就 ...

  10. 【Git使用具体解释】EGit使用具体解释

    此系列文章写给那些打算使用Git或正在使用Git,但对Git还不是非常理解的程序员们,希望能帮助大家在学习和使用Git的过程中少走弯路,并以最少的时间和代价来熟悉Git,让Git可以辅助很多其它的开发 ...