JavaScript 正则表达式
@(笔记)[正则表达式]
第一章 课程简介
1-1 JS正则表达式简介及应用
课程目标
-了解正则表达式的语法
-在IDE中使用正则表达式处理规则复杂的字符串查找，替换需求
-在JavaScript程序设计中使用正则表达式处理字符串
-Regular Expression使用单个字符串来描述，匹配一系列符合某个句法规则的字符串
-说简单了就是按照某种规则去匹配符合条件的字符串
第二章 认识正则表达式
2-1 Reg Exp对象
Reg Exp对象
Javascript通过内置对象Reg Exp支持正则表达式
有两种方法实例化Reg Exp对象
1.字面量
var reg = /\bis\b/g;
"He is a boy.This is a dog.Where is she?".replace =(reg,"IS");
返回值：
"He IS a boy.This IS a dog.Where IS she?"
2.构造函数
var reg = new RegExp("\\bis\\b","g");//构造函数中反斜线（\）需要转意，因为反斜线本身是特殊字符
"He is a boy.This is a dog.Where is she?".replace =(reg,"IS");
返回值：
"He IS a boy.This IS a dog.Where IS she?"
修饰符
-g：global全文搜索，不添加，搜索到第一个匹配停止。
-i：ignore case忽略大小写，默认大小写敏感。
-m：multiple lines 多行搜索。
2-2 元字符
1.正则表达式由两种基本字符类型组成
-原义文本字符
-元字符
2.元字符是正则表达式中有特殊含义的非字母字符
* + ? $ ^ . | \ () {} []
| 符号 | 含义 |
|---|---|
| \t | 水平制表符 |
| \v | 垂直制表符 |
| \n | 换行符 |
| \r | 回车符 |
| \0 | 空字符 |
| \f | 换页符 |
| \cX | 与X对应的控制字符（ctrl+X） |
2-3 字符类
-一般情况下正则表达式一个字符对应字符串一个字符
-表达式ab\t的含义是 ●—"ab"—tab—●
-我们可以使用元字符[ ]来构建一个简单的类
-所谓类似指符合某些特性的对象，一个泛指，而不是指特定的某个字符
-表达式[abc]把字符a或b或c归为一类，表达会可以匹配这类的字符
例：
"a1b2c3d4".replace(/[abc]/g,"X");
返回值：
"X1X2X3d4";
字符类取反
-使用元字符^创建反向类/负向类
-反向类的意思是不属于某类的内容
-表达式[^abc]表示不是字符a或b或c的内容
注意：
[abc]与[abc]的区别：
[^abc]的图示为：
^[abc]的图示为：
例：
-
"a1b2c3d4".replace(/[^abc]/g,"X");
返回值："aXbXcXXX";
-
"a1b2c3d4".replace(/^[abc]/g,"X");
返回值："X1b2c3d4";
2-4 范围类
-正则表达式提供了范围类
-我们可以使用[a-z]来链接连个字符表示，从a到z的任意字符
-这是一个闭区间，也就是包含a和z
[a-z]图示：
例：
"a1b2c3d45ef9".replace(/[a-z]/g,"X");
返回值：
"X1X2X3X45XX9";
-在[ ]组成的类内部是可以连写的[a-zA-Z]
[a-zA-Z]图示如下：
匹配范围类同时也匹配"-"怎么办？
例：
"2017-09-21".replace(/[0-9-]/g,"X");
返回值：
"XXXXXXXXXX";
2- 5 预定义类及边界
预定义类
-正则表达式提供了预定义类来匹配常见的字符
| 字符 | 等价类 | 含义 |
|---|---|---|
| . | [^\r\n] | 除了回车符和换行符之外的字符 |
| \d | [0-9] | 数字字符 |
| \D | [^0-9] | 非数字字符 |
| \s | [\t\n\XOB\f\r] | 空白符 |
| \S | [^\t\n\XOB\f\r] | 非空白符 |
| \w | [a-zA-Z_0-9] | 单字符（字母、数字、下划线） |
| \W | [^a-zA-Z_0-9] | 非单字符 |
例：匹配一个ab+数字+任意字符的字符串
var reg = /ab\d./g;
图示：
-正则表达式还提供了几个常用的边界匹配符
| 字符 | 含义 |
|---|---|
| ^ | 以xxx开始,例：var reg = /^a/g;（区别[\d]、[\d]） |
| $ | 以xxx结束,例：var reg = /a$/g;
|
| \b | 单词边界 |
| \B | 非单词边界 |
2-6 量词
| 字符 | 含义 |
|---|---|
| ？ | 出现零次或一次（最多出现一次） |
| + | 出现一次或多次（最少出现一次） |
| * | 出现零次或多次（任意次） |
| {n} | 出现n次 |
| [n,m] | 出现n到m次 |
| {n,} | 出现至少n次 |
2- 7 JavaScript正则贪婪模式与非贪婪模式
-贪婪模式：尽可能多的匹配（默认）
例：
"12345678".replace(/\d{3,6}/g,"X");
返回值：
"X78"
-非贪婪模式：让正则表达式尽可能少的匹配，也就是说一旦成功匹配不再继续尝试就是非贪婪模式
-做法很简单,在量词后面加上 ? 即可
例：
"12345678".replace(/\d{3,6}?/g,"X");
返回值：
"XX78";
2-8 分组、或
-匹配字符串Byron连续出现3次的场景
var reg = /Byron{3}/g;
图示为：
注意：量词作用于前面紧挨着的字符，并不是前面整个单词。
-使用（）可以达到分组的功能，使用量词作用于分组
var reg = /(Byron){3}/g;
图示：
例：
"a1b2c3d4".replace(/([a-z]\d){3}/g,"X");
返回值：
"Xd4";
或
-使用 | 可以达到或的效果
var reg = /Byron | Casper/;
var reg = /Byr(on | Ca)sper/;
图示：
例：
"ByronCasper".replace(/Byron|Casper/g,"X");
返回值：
"XX";
反向引用（"$"）
例：把"2017-09-21"转换成"09/21/2017"
"2017-09-21".replace(/(\d{4})-(\d{2})-(\d{2})/g,"$2/$3/$1");
返回值：
"09/21/2017";
忽略分组
-不希望捕获分组，只需要在分组内加上 ？： 就可以(分组括号内的最前面)
var reg = /(?:Byron).(ok)/;
2-9 前瞻
-JavaScript正则表达式从文本头部向文本尾部开始解析，文本尾部方向，成为"前"
-前瞻就是正则表达式匹配到规则的时候，向前检查是否符合断言后顾/后瞻方向相反
-JavaScript不支持后顾
-符合和不符合特定断言成为肯定/正向匹配和否定/负向匹配
| 名称 | 正则 | 含义 |
|---|---|---|
| 正向前瞻 | exp(?=assert) | |
| 负向前瞻 | exp(?！assert) | |
| 正向后顾 | exp(?<=assert) | JavaScript不支持 |
| 负向后顾 | exp(?<！=assert) | JavaScript不支持 |
例：
var reg = /\w(?=\d)/;
图示：
例：
"#4g@b7^!".replace(/\w(?=\d)/g,"X");
返回值：
"#4g@X7^!";
2-10 对象属性
-global：是否全文搜索，默认false
-ignore case：是否大小写敏感，默认是false
-multiline：多行搜索，默认值是false
-lastIndex：是当前表达式匹配内容的最后一个字符的下一个位置
-source：正则表达式的文本字符串
例：
var reg1 = /\w/;
var reg2 = /\w/gim;
reg1.global; //false
reg1.ignoreCase; //false
reg1.multiline; //false
reg2.global; //true
reg2.ignoreCase; //true
reg2.multiline; //true
reg1.source; //"\w"
reg2.source; //"\w"(文本字符串不包含标识符)
2-11 text和exec方法
RegExp.prototype.test(str)
-用于测试字符串参数中是否存在匹配正则表达式模式的字符串
-如果存在返回true，否则返回false
例：
var reg1 = /\w/;
reg1.test("a");//true
reg1.test("$");//false
var reg2 = /\w/g;
reg2.test("ab");//true
reg2.test("ab");//true
reg2.test("ab");//false
reg2.test("ab");//true
reg2.test("ab");//true
reg2.test("ab");//false(lastIndex属性原因导致)
RegExp.prototype.exec(str)
-使用正则表达式模式对字符串执行搜索，并将更新全局RegExp对象的属性以反映匹配结果
-如果没有匹配的文本则返回null，否则返回一个结果数组：
1.index声明匹配文本的第一个字符的位置
2.input存放被检索的字符串 string
非全局调用
-调用非全局的RegExp对象的exec( )时，返回数组
-第一个元素是与正则表达式想匹配的文本
-第二个是与RegExpObject的第一个子表达式相匹配的文本（如果有的话）
-第三个元素是与RegExp对象的第二个子表达式相匹配的文本（如果有的话），以此类推
例：
var reg1 = /\d(\w)\d/;
var ts = "1a2b3c4d5e";
var ret = reg1.exec(ts);
console.log(reg1.lastIndex + "\t" + ret.index + "\t" + ret.toString();//执行第一次
console.log(reg1.lastIndex + "\t" + ret.index + "\t" + ret.toString();//执行第二次
返回值：
0 0 1a2,a;//第一个0因为在非全局下lastIndex属性不生效所以是0
0 0 1a2,a;//在非全局下无论执行多少次lastIndex属性不生效都是0
(全局搜索)例：
var reg2 = /\d(\w)(\w)\d/g;
var ts = "1az2bb3cy4dd5ee";
while(ret = reg2.exec(ts)){
console.log(reg2.lastIndex + "\t" + ret.index + "\t" + ret.toString());
}
返回值：
4 0 1az2,a,z;//全局搜索lastIndex生效
10 6 3cy4,c,y;//全局搜索lastIndex生效
2-12 字符串对象方法
String.prototype.search(reg/string)
-search( )方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串
-方法返回第一个匹配结果index，查不到返回-1
-search( )方法不执行全局匹配，它忽略标志g，并且总是从字符串的开始进行检索
例：
"a1b2c3d1".search("1"); //返回 1
"a1b2c3d1".search("10"); //没找到返回 -1
"a1b2c3d1".search(2); //输入数字，自动转化为正则即：/2/
"a1b2c3d1".search(/2/); //返回 3
String.prototype.match(reg)
-match( )方法将检索字符串，以找到一个或多个与regexp匹配的文本
-regexp是否具有标志g对结果影响很大
非全局调用
-如果regexp没有标志g，那么match()方法就只能在字符串中执行一次
-如果没有找到任何匹配文本，将返回null
-否则它将返回一个数组，其中存放了与它找到的匹配文本有关的信息
-返回数组的第一个元素存放的是匹配文本，而其余的元素存放的是与正则表达式的子表达式匹配的文本
-除了常规的数组元素之外，返回的数组还含有2个对象属性
1.index声明匹配文本的起始字符在字符串的位置
2.input声明对stringObject的引用
例：
var reg1 = /\d(\w)\d/;
var ts = "$1a2b3c4d5e";
var ret = ts.match(reg1);
console.log(ret);
console.log(ret.index + "\t" + reg1.lastIndex);
返回值：
["1a2", "a", index: 1, input: "$1a2b3c4d5e"];//FireFox结果
1 0;//非全局调用下lastIndex属性不生效所以是 0
全局调用
-如果regexp具有标志g则match( )方法将执行全局检索，找到字符串中的所有匹配子字符串
1.没有找到任何匹配的字符串，则返回null
2.如果找到了一个或多个匹配字符串，则返回一个数组
-数组元素中存放的是字符串中多有的匹配字符串，而且也没有index属性或input属性
例：
var reg2 = /\d(\w)\d/g;
var ts = "$1a2b3c4d5e";
var ret = ts.match(reg2);
console.log(ret);
console.log(ret.index + "\t" + reg1.lastIndex);
返回值：
["1a2", "3c4"];
undefined 0; // index属性不存在 lastIndex未生效
String.prototype.split(reg)
-我们经常使用split方法把字符串分割为数组
"a,b,c,d".split(",");//["a","b","c","d"]
-在一些复杂的分割情况下我们可以使用正则表达式解决
"a1b2c3d".split(/\d/);//["a","b","c","d"]
String.prototype.replace
-String.prototype.replace(str,replaceStr)
-String.prototype.replace(reg,reolaceStr)
-String.prototype.replace(reg,function)
function参数含义
function会在每次匹配替换的时候调用，有四个参数
1.匹配字符串
2.正则表达式分组内容，没有分组则没有改参数
3.匹配项在字符串中的 index
4.原字符串
例(不带分组的)：
"a1b2c3d4e5".replace(/\d/g,function(match,index,origin){
console.log(index);
return parseInt(match) + 1;
});
返回值：
1;//本次匹配的字符串第一个字符的下标
3;//本次匹配的字符串第一个字符的下标
5;//本次匹配的字符串第一个字符的下标
7;//本次匹配的字符串第一个字符的下标
9;//本次匹配的字符串第一个字符的下标
"a2b3c4d5e6";
例（带分组的）：
"a1b2c3d4e5".replace(/(\d)(\w)(\d)/g,function(match,group1,group2,group3,index,origin){
console.log(match);
return group1 + group3;
});
返回值：
1b2;//本次匹配的字符串
3d4;//本次匹配的字符串
"a12c34e5";
