每天10个前端知识点：正则表达式

2017-02-17

以下内容若有问题烦请即时告知我予以修改，以免误导更多人。

1. 正则表达式

用处：处理字符串

RegExp对象

var reg = new RegExp('字符串', [选项]); 可选选项

选项：

i ignore 忽略大小写
g global 全局匹配
m multi-line 多行匹配

字符串为正则表达式时，不能用选项，直接在正则表达式//后增加选项

2. 正则定义的多种方法

var a = 'aaa';
var reg = new RegExp(a, 'g'); 正则可以使用变量形式
var reg = /\d+/g; 正则不可以使用变量形式
str.replace(/\d/g, '');

3. 正则校验

reg.test(str);

true -> 校验通过
false -> 校验不通过

4. 正则使用的字符串相关方法

str.search('w') 查找w
- 成功返回w的下标
- 失败返回-1
str.match('w') 匹配w 返回值类型：数组(object)
- 成功返回w
- 失败返回null
str.replace('xxx', 'yyy') 被替换内容，替换内容

修改第一个被替换内容
替换不修改原字符串, 需重新声明
第二个参数可为一个方法
replace可以连用

示例

<script>
	var str = 'aaa';
	var str2 = str.replace('a', 'b');

	console.log(str);  // aaa
	console.log(str2);  // baa
</script>

<script>
	str.replace('xxx', function(s) {
		console.log(s);  // **参数s为被替换字符  数据类型：string
		var star = '';
		for (var i = 0; i < s.length; i++) {
			star += '*';
		}
		return star;  // 返回替换内容
	})
</script>

5. 特殊字符

. 匹配任何单字符(除换行符\n)
^ 匹配开始位置
- 不选m 匹配字符串的开始位置
- 选m 识别字符串的换行，并匹配字符串每行的开始位置
$ 匹配结束位置
() 标记子表达式
[] 标记元字符表达式
{} 标记限定符表达式

6. 元字符(一个字符)

[abc] 字符集合 -> /a|b|c/
[^abc] 负值字符集合 -> 除了abc
[0-9] 字符范围 -> /0|1|2|3|4|5|6|7|8|9/ eg: [1-29] -> [1-2]或者[1-9]
[^0-9] 负值字符范围 -> 非数字

7. 限定符

{n} 匹配n个
{n,} 最少匹配n个
{,m} 最多匹配m个
{n,m}最少匹配n个，最多匹配m个 n,m为非负整数(n<=m)
* 匹配{0,} eg: 'zo*' -> 'z'及'zo'、'zooooo'
+ 匹配{1,} eg: 'zo+' -> 'zo'及'zoo'、'zooooo'
? 匹配{0,1} eg: 'do(es)?' -> 'do'或'does'

8. 转义字符

\\ \ eg: \\\\\ -> \\ 会报错
\n 换行符
\r 回车符
\f 换页符
\d digital 数字(不认识小数) [0-9]
\w word 单词(包括下划线) [A-Za-z0-9_]
\s space 空白字符
\D 非数字 [^0-9]
\W 非单词 [^A-Za-z0-9_]
\S 非空白字符

var reg = /\d/; -> 选项 /\d/g; -> 匹配一次或多次 /\d+/g

9.单词边界

找确定单词时在正则中加上单词边界 \b

在正则中需转义为 \\b

var reg = new RegExp('\\bAAAA\b');

10. 简单示例

/\d+/ 一串数字
/\d\d+/ 最少2个数字
/.+/ 任意多个
/.*/ 可有可无

更多内容可以订阅本人微信公众号，一起开启前端小白进阶的世界！
微信公众号：无媛无故