正则表达式的模式匹配

1. 正则表达式的定义

1. 构造函数：

var reg = new RegExp("abc","g")

其中： g,全局匹配，i不区分大小写，m执行多行匹配

2. /pattern/attributes

var reg = /abc/g;

2. test 和 exec的区别

1. test 返回 Boolean，查找对应的字符串中是否存在模式。
2. exec 查找并返回当前的匹配结果，并以数组的形式返回。

var str = 'something with js'
var parrent = /js/i
console.log(parrent.test(str))    //true
console.log(parrent.exec(str)[0])    //js

exec方法受参数g的影响，若指定了 g，则下次调用 exec 时，会从上个匹配的 lastIndex 开始查找：

上次匹配采用test和exec方法，影响都是一样的。

var str = 'M:jsaajsaajs'
var parrent = /js/ig
console.log(parrent.test(str))	  //true
console.log(parrent.exec(str))    //["js", index: 6, input: "M:jsaajsaajs",groups: undefined]
console.log(parrent.exec(str))    //["js", index: 10, input: "M:jsaajsaajs", groups: undefined]

3. 转义字符 \

字母前面加上反斜线 "\" 来表示常见的那些不能显示的ASCII字符.称为转义字符。

转义字符	意义	ASCII码值（十进制）
\n	换行(LF)	010
\r	回车(CR)	013
\t	水平制表(HT)	009
\\	代表一个反斜线字符''\'	092

4. 特殊字符

在表达式中有特殊意义，需要在它前面添加 "\" 才能当作普通文本字符来使用。

用正则匹配HTTP响应体中的字符串：需要注意要匹配一个\，你需要写四个\作为匹配特征，其中\\是正则写法，而在字符串中又要对\\分别进行转义，也就是需要四个\。

特殊字符
^	匹配一行开头
$	匹配一行结尾
*	匹配0次或多次
+	匹配1次或多次
？	0次或1次
{n}	n次
{n,}	n次以上
{n,m}	匹配n-m次
[xyz]	匹配集合中的人一个字符
[^xyz]	不匹配集合中的任何一个字符
.	匹配除“\n”和"\r"之外的任何单个字符。要匹配包括“\n”和"\r"在内的任何字符，请使用像“[\s\S]”的模式。

5. 字符等价写法

字符	等价写法
\d	等价于[0-9]，即数字
\D	等价于[^0-9]
\w	等价于[A-Za-z_0-9]，即数字字母下划线
\W	[^A-Za-z_0-9]
\s	指空白，包括空格、换行tab缩进等空白

正则表达式的匹配会先满足第一个可能匹配的位置：

var str = 'aaab';
var pattern = /a+b/;
console.log(pattern.exec(str));    //"aaab"

var str = 'aaab';
var pattern = /a+?b/;
console.log(pattern.exec(str));    //"aaab"

var str = '<td><p>a</p></td><td><p>b</p></td>';
var pattern = /<td>.*<\/td>/;
console.log(pattern.exec(str));    //"<td><p>a</p></td><td><p>b</p></td>"

var str = '<td><p>a</p></td><td><p>b</p></td>';
var pattern = /<td>.*?<\/td>/;
console.log(pattern.exec(str));    //"<td><p>a</p></td>"

6. 字符分组 ()

?:取消数组捕获

//会有数组捕获
var str = 'abcd';
var pattern = /(ab)c/;
console.log(pattern.exec(str));    //['abc','ab']

//?:取消数组捕获
var str = 'abcd';
var pattern = /(?:ab)c/;
console.log(pattern.exec(str));     //['abc']

\1 表示第一个分组

var str = 'ab cd ab';
var pattern = /(ab) cd \1/;    //   \1 表示第一个分组，当前只有一个，所以就是ab
console.log(pattern.exec(str));    //["ab cd ab", "ab"]   

//运用
var str = '<p><a>这是一段文字</a></p>';
var pattern = /<([a-zA-Z]+)>(.*?)<\/\1>/;    //  \1就能够表示和起始标签相同的结束标签
console.log(pattern.exec(str));    //["<p><a>这是一段文字</a></p>","p","<a>这是一段文字</a>"]

7. 跨浏览器兼容的获取className的方法

需要考虑className不是单独一个的情况。

function getByClassName(className, parentNode) {
  if (document.getElementsByClassName) {
	return document.getElementsByClassName(className);
  } else {
	parentNode = parentNode || document;
	var nodeList = [];
	var allNodes = parentNode.getElementsByTagName('*'); //匹配所有元素或则其子元素下的节点
	var pattern = new RegExp('\\b' + className + '\\b');	//  \b表示边界，并且正则中的\需要转义

	for (var i = 0; i < allNodes.length; i++) {
	  if (pattern.test(allNodes[i].className)) {
		nodeList.push(allNodes[i]);//将匹配的节点存在nodeList中
	  }
	}
	return nodeList;
  }
}

8 . 匹配

前瞻性匹配： (?= ) 需要匹配java后面是script的java

var str = 'javascript';
var pattern = /java(?=script)/;
console.log(pattern.exec(str));

负向前瞻性匹配： (?! ) 匹配java后面不是script的java

var str = 'javasda';
var pattern = /java(?!script)/;
console.log(pattern.exec(str));

9. string对象中与正则表达式相关的方法

search：只要找到一个立马返回，无匹配的返回-1

var str = 'htnl js'
var pattern = /js/
console.log(str.search(pattern))   //5

match：只有非全局匹配，才会返回分组中匹配到的内容；全局匹配只会一次返回所有匹配到的字符。

var str = 'js js js';
var pattern = /js/g;
console.log(str.match(pattern));    //js js js

exec VS test 在全局匹配下都会继续往下匹配

var str = 'js js js';
var pattern = /(j)s/g;
console.log(pattern.test(str));    //true   
console.log(pattern.test(str));    //true
console.log(pattern.test(str));    //true
console.log(pattern.test(str));    //false

match VS exec 匹配：

exec：无论是否全局匹配，都会返回分组中匹配到的内容；无论是否全局匹配都只返回当前匹配到的内容，而不是所有，只不过全局匹配时可以继续匹配下去。

var str = 'js js js';
var pattern = /js/g;
console.log(pattern.exec(str));		//0
console.log(pattern.exec(str));		//3
console.log(pattern.exec(str));		//6
console.log(pattern.exec(str));		//null
console.log(pattern.exec(str));		//0

m 用于多行全局匹配。

split：将字符串分割成数组，跟数组中的join刚好相反。

（将匹配后的字符中的空格删除）

var str = 'html ,   css  ,   js';
var pattern = /\s*,\s*/;
console.log(str.split(pattern));

10 . 字符串的替换 replace （使用字符串的话只替换一个）

可以用正则全部替换：

var str = 'I love js js';
var pattern = /js/g;
console.log(str.replace(pattern, 'html'));    //I love html html

注意：原字符串不会改变。

屏蔽敏感字：根据正则的长度替换相应字符

var str = '中国军队和阿扁一起办证';
var pattern = /国军|阿扁|办证/g;
console.log(str.replace(pattern, function ($0) {
	console.log($0);
	var result = '';
	for (var i = 0; i < $0.length; i++) {
		result += '*';
	}

	return result;    //中**队和**一起**
}))

11. 常用正则表达式

1. QQ号 // 全是数字，首位不能为0 ，最少5位(10000)

/^[1-9]\d{4,}$/

2. 昵称： // 中、英文、数字以及下划线， 2-18位

/^[\u4e00-\u9fa5\w]{2,18}$/

3. 密码： // 6-16位，不能用空白字符 \S

/^\S{6,16}$/

4. 去除空格： //先去除左边空格，再去除右边

// 	trimLeft trimRight
var str = '        Alex         ';
function trim(str) {
  return str.replace(/^\s+/, '').replace(/\s+$/, '');	//先去除左边空格，再右边
}
console.log('|' + trim(str) + '|');    //   |Alex|

5. 转驼峰

// 返回的第二个数组就是那个字母

var str = 'background-color';
var pattern = /-([a-z])/gi;		//数组的形式，为了能够得到那个字母

function toCamelCase(str) {
  return str.replace(pattern, function (all, letter) {
	return letter.toUpperCase();   //  返回的第二个数组就是那个字母
  })
}
console.log(toCamelCase(str))    //backgroundColor

6. 匹配html标签

var str = '<input type="text" value=">" name="username" />';
var hstr = '<p class=""></p>'
var pattern = /<(?:[^"'>]|(["'])[^"']*\1)*>/g; //非捕获性分组，匹配除了"'> 这些的所有内容或者匹配""的内容
console.log(str.match(pattern));	//<input type="text" value=">" name="username" />
console.log(hstr.match(pattern));	// ["<p class="">", "</p>"]

7. 匹配邮箱 // [email protected]

// [email protected]

	/(?:\w+\.)*\w+@(?:\w+\.)+[a-z]{2,4}/i

8. URL

(协议:\/\/)主机名(:端口号)(/路径)

/^(https?:\/\/)?([^:\/]+)(:\d+)?(\/.*)?$/