前端培训-初级阶段（13） - 正则表达式
转载自 SegmentFault
前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门，但也仅仅是入门，现在前端开发的定义已经远远不止这些。前端小课堂（HTML/CSS/JS），本着提升技术水平，打牢基础知识的中心思想，我们开课啦（每周四）。
该文为前端培训-初级阶段（13、18）的补充内容 (介绍了 ECMAScript 历史，ES6 常用点)。
本文介绍ECMAScript基础知识。
-
前端培训-初级阶段（13） - ECMAScript （语法、变量、值、类型、运算符、语句）
-
前端培训-初级阶段（13） - ECMAScript （内置对象、函数）
-
前端培训-初级阶段（13） - 类、模块、继承
基础内容知识我们会用到。默认已读。
我们要讲什么？
-
正则表达式基本的关键词
-
正则表达式一些进阶用法（预查断言）
-
常见正则
-
实战场景
正则表达式基本的关键词
-
声明一个正则表达式 1）
var reg=new RegExp('规则','条件');因为规则是一个字符串，所以可以拼接，比如new RegExp(['违规','骂人','涉黄','涉政'].join('|')).test('正经人涉黄')在这个场景当中，我们需要根据其他词库，来生成过滤正则。 2）var reg=/规则/条件;一般来说我们使用这个，方便快捷
条件
关键词 说明 用法
i
ignore 忽略大小写
一般用在标签匹配比如 <img>和<IMG>
g global 全局 一般用在需要匹配多个区域的时候比如违规词语要替换成**
m multiline 多行 这个用的比较少
规则
里面的所有｜都是错的，需要自己替换成半角的|
关键词 匹配项 说明 用法
字符串 常规字符 直接填入你要匹配的字符即可，关键词需要转义
'骂人，骂人的话'.replace(/骂人/g, '**')
\d
数字0-9的缩写，也等价于[0-9]
'0313-0000000'.replace(/\d/g, '*')
\w
单词，也等价于[a-zA-Z0-9_]
'tel: 0313-;URI: lilnong.top'.replace(/\w/g, '*')
\s
任何不可见字符，包括空格、换行等。等价于[ \f\n\r\t\v]
' \f\n\r\t\v'.replace(/\s/g, '*')
\b
单词边界，类似于$
'lists list'.replace(/s\b/g, '')
\D \W \S \B
等同于上面小写的取反
\num
匹配之前的分组num为索引，可以用来查找重复字符
'abbcccddddeffffffff'.match(/(\w)\1+/g)
( )
分组 可以用来给\num匹配，也可以用来给match函数使用
｜
或 用来标识关键字匹配其中的即可
'x + y = ?'.replace(/x｜y/g,()=>Math.random()*50>>0)
[xyz]
字符集合 比较常用里面可以放上面的关键词
'x + y = ?'.replace(/[xy]/g,()=>Math.random()*50>>0)
.
除“\n”和”\r”之外的任何单个字符。
上面介绍了常见的规则，其实还有一些匹配的量词
关键词 匹配项 说明 用法
^
标识开始
'onchange'.match(/^on\w+/)
$
标识结束
'abc.mp4.avi'.match(/\.\w+$/)
*
0或多个，等价于{0,}
'abbccc'.match(/a*/g)
+
1或多个，等价于{1,}
'abbccc'.match(/a+/g)
?
0活1个，等价于{0,1}
'abbccc'.match(/a?/g)
{n,m}
n和m可以省略一个，也可以都写上，限定个数
正则表达式一些进阶用法（预查）
js中的支持的不是很好
-
将简单的网址：www.abc.com中的中间部分abc提取出来
-
正向零宽先行断言
'https://segmentfault.com/write'.match(/\w+(?=\.com)/)
常见正则
-
邮箱
/\w+@\w+(\.\w+)+/ -
手机号
/^1\d{10}$/.test('15075754545')
实战
-
匹配歌词文件
-
获取URL中的参数
location.search.match(/[?&]q=[^&]*/)q为key
后记
主讲人文章-2019.04.18。
我虽然忙没写出来，但是学习我们是一直在做的。赶赶进度。
原文：SegmentFault