简介
regular expression
用一个“字符串”来描述一个特征，然后去验证另一个“字符串”是否符合这个特征。
基本语法
转义字符
| 表达式 | 可匹配 |
|---|---|
\\ |
代表\本身 |
\^ |
代表^符号本身 |
\$ |
代表$符号本身 |
\. |
代表.本身 |
需要转义才能匹配的字符
| 表达式 | 可匹配 |
|---|---|
^ |
匹配输入字符串的开始位置。要匹配^字符本身，请使用\^ |
$ |
匹配输入字符串的结尾位置。要匹配$字符本身，请使用\$ |
() |
标记一个子表达式的开始和结束位置。要匹配小括号，请使用\(和\) |
[] |
用来自定义能够匹配多种字符的表达式。要匹配中括号，请使用\[和\] |
{} |
修饰匹配次数的符号。要匹配大括号，请使用\{和\} |
. |
匹配除了换行符（\n）以外的任意一个字符。要匹配小数点本身，请使用\. |
? |
修饰匹配次数为0次或1次。要匹配?字符本身，请使用\? |
+ |
修饰匹配次数为至少1次。要匹配+字符本身，请使用\+ |
* |
修饰匹配次数为0次或任意次。要匹配*字符本身，请使用\* |
| |
左右两边表达式之间或关系。匹配|本身，请使用\| |
特殊字符
| 表达式 | 可匹配 |
|---|---|
\r |
代表回车符 |
\n |
代表换行符 |
\t |
代表制表符 |
. |
小数点可以匹配除了换行符(\n)以外的任意一个字符 |
\d |
任意一个数字，0~9中的任意一个 |
\w |
任意一个字母或数字或下划线，也就是A~Z、a~z、0~9、_中任意一个 |
\s |
包括空格、制表符、换页符等空白字符的其中任意一个 |
\D |
任意一个非数字字符；与\d相反 |
\W |
任意一个所有字符、输入下划线以外的字符；与\w相反 |
\S |
任意一个非空白字符；与\s相反 |
\xXX(X表示一个十六进制数) |
编号在0~255范围的字符。比如空格使用使用x20表示 |
\uXXXX(X表示一个十六进制数) |
任何字符可以使用\u再加上其编号的4位十六进制数表示。比如\u4E2D |
抽象字符和表达式
| 表达式 | 作用 |
|---|---|
^ |
与字符串开始的地方匹配，不匹配任何字符 |
$ |
与字符串结束的地方匹配，不匹配任何字符 |
\b |
匹配一个单词边界，也就是单词和空格之间的位置，不匹配任何字符 |
\B |
非单词边界，即左右两边都是\w范围或者左右两边都不是\w范围时的字符缝隙 |
| |
左右两边表达式之间"或"关系，匹配左边或者右边 |
() |
匹配次数时，作为整体被修饰。取匹配结果时，括号中匹配到的内容可单独得到 |
匹配多种字符
使用方括号[]包含一系列字符，能够匹配其中任意一个字符。
用[^]包含一系列字符，责能够匹配其中字符之外的任意字符。
匹配一个
| 表达式 | 可匹配 |
|---|---|
[ab5@] |
匹配a或b或5或@ |
[^abc] |
匹配a、b、c之外的任意一个字符 |
[f-k] |
匹配f~k之间的任意一个字母 |
[^A-F0-3] |
匹配A~F、0~3之外的任意一个字符 |
匹配次数
| 表达式 | 作用 | 示例代码 | 示例说明 |
|---|---|---|---|
{n} |
表达式重复n次 | \w{2} |
\w\w 匹配任意字母、数字或下划线两次 |
{m,n} |
表达式至少重复m次，最多重复n次 | 可匹配ba{1,3} |
ba、baa、baaa等，a字母重复1~3次 |
{m,} |
表达式至少重复m次 | \w\d{2,} |
可匹配a12、_456、M12345等，后面的数字至少重复2次 |
? |
表达式重复0次或者1次，相当于{0,1} |
a[cd]? |
可匹配a、ac、ad |
+ |
表达式至少出现1次，相当于{1,} |
a+b |
可匹配ab、aab、aaab等，a字母至少重复1次 |
* |
表达式出现0次或任意次，相当于{0,} |
\^*b |
可匹配b、^b、^^^^b等，^符号重复0次或者任意次 |
贪婪模式和非贪婪模式
- 带
+、*和{m,n}的表达式都是尽可能地多匹配 - 带
?的表达式在可匹配可不匹配的时候，也是尽可能的"要匹配" - 在修饰匹配次数的特殊符号后再加上一个
?号，则可以使匹配次数不定的表达式尽可能少的匹配，使可匹配可不匹配的表达式，尽可能的"不匹配"
以字符串dxxxdxxxd为例，匹配后\w+或者\w+?匹配出的结果
| 表达式 | 作用 |
|---|---|
(d)(\w+) |
贪婪模式：\w+将匹配第一个d之后的所有字符，结果xxxdxxxd |
(d)(\w+)(d) |
贪婪模式：\w+将匹配第一个d和最后一个d之间的所有字符，结果xxxdxxx |
(d)(\w+?) |
非贪婪模式：\w+?将尽可能少的匹配第一个d之后字符，结果x |
(d)(\w+?)(d) |
非贪婪模式：为了让整个表达式匹配成功，\w+?不得不匹配xxx才可以让后边的d匹配，从而使整个表达式匹配成功。结果xxx |
// 后边多一个？表示懒惰模式。
// 必须跟在 * 或者 + 后边用
const str = `<img src="test.jpg" width="60px" height="80px"/>`
/**
* 默认是贪婪模式，尽可能多的匹配
* 往后匹配，直到最后一个 " 匹配结束
*/
const reg1 = /src="(.*)"/
/**
* 在 * 或者 + 后面加上 ?，变成懒惰模式。尽可能少的匹配
* 匹配到第一个 " 就结束了一次匹配。不会继续向后匹配。因为他懒惰嘛
*/
const reg2 = /src="(.*?)"/
console.log(str.match(reg1)[0]) // src="test.jpg" width="60px" height="80px"
console.log(str.match(reg1)[1]) // test.jpg" width="60px" height="80px
console.log(str.match(reg2)[0]) // src="test.jpg"
console.log(str.match(reg2)[1]) // test.jpg
reg1.test(str)
console.log(RegExp.$1) // test.jpg" width="60px" height="80px
reg2.test(str)
console.log(RegExp.$1) // test.jpg
表达式修饰符
正则表达式中常用的模式修正符有i、g、m、s等
它们之间可以组合搭配使用
i：不区分(ignore)大小写
例如: /abc/i 可以匹配 abc、aBC、Abc
g：全局(global)匹配
- 如果不带
g，正则过程中字符串从左到右匹配，找到第一个符合条件的即匹配成功，返回 - 如果带
g，则字符串从左到右，找到每个符合条件的都记录下来，知道字符串结尾位置
const str = 'aaaaaaaa'
const reg1 = /a/
const reg2 = /a/g
console.log(str.match(reg1)) // ["a", index: 0, input: "aaaaaaaa"]
console.log(str.match(reg2)) // ["a", "a", "a", "a", "a", "a", "a", "a"]
m：多(more)行匹配
- 若存在换行
\n并且有开始^或结束$符的情况下，和g一起使用实现全局匹配, - 因为存在换行时默认会把换行符作为一个字符任务匹配字符串是个单行，
g只匹配第一行，添加m之后实现多行，每个换行符之后就是开始
const str = "abcggab\nabcoab"
const reg1 = /^abc/gm
const reg2 = /ab$/gm
console.log(str.match(reg1)) // ["abc", "abc"]
console.log(str.match(reg2)) // ["ab", "ab"]
s：特殊字符圆点 . 中包含换行符
默认的圆点 . 是 匹配除换行符 \n 之外的任何单字符，加上s之后, . 中包含换行符
const str = "abggab\nacbs"
const reg1 = /b./g
const reg2 = /b./sg
console.log(str.match(reg1)) // [ 'bg', 'bs' ]
console.log(str.match(reg2)) // [ 'bg', 'b\n', 'bs' ]
常用正则
校验数字的表达式
- 数字：
^[0-9]*$- n位的数字：
^\d{n}$- 至少n位的数字：
^\d{n,}$- m-n位的数字：
^\d{m,n}$- 零和非零开头的数字：
^(0|[1-9][0-9]*)$- 非零开头的最多带两位小数的数字：
^([1-9][0-9]*)+(.[0-9]{1,2})?$- 带1-2位小数的正数或负数：
^(\-)?\d+(\.\d{1,2})?$- 正数、负数、和小数：
^(\-|\+)?\d+(\.\d+)?$- 有两位小数的正实数：
^[0-9]+(.[0-9]{2})?$- 有1~3位小数的正实数：
^[0-9]+(.[0-9]{1,3})?$- 非零的正整数：
^[1-9]\d*$或^([1-9][0-9]*){1,3}$或^\+?[1-9][0-9]*$- 非零的负整数：
^\-[1-9][]0-9"*$或^-[1-9]\d*$- 非负整数：
^\d+$或^[1-9]\d*|0$- 非正整数：
^-[1-9]\d*|0$或^((-\d+)|(0+))$- 非负浮点数：
^\d+(\.\d+)?$或^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$- 非正浮点数：
^((-\d+(\.\d+)?)|(0+(\.0+)?))$或^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$- 正浮点数：
^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$或^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$- 负浮点数：
^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$或^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$- 浮点数：
^(-?\d+)(\.\d+)?$或^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$
校验字符的表达式
- 汉字：
^[\u4e00-\u9fa5]{0,}$- 英文和数字：
^[A-Za-z0-9]+$或^[A-Za-z0-9]{4,40}$- 长度为3-20的所有字符：
^.{3,20}$- 由26个英文字母组成的字符串：
^[A-Za-z]+$- 由26个大写英文字母组成的字符串：
^[A-Z]+$- 由26个小写英文字母组成的字符串：
^[a-z]+$- 由数字和26个英文字母组成的字符串：
^[A-Za-z0-9]+$- 由数字、26个英文字母或者下划线组成的字符串：
^\w+$或^\w{3,20}$- 中文、英文、数字包括下划线：
^[\u4E00-\u9FA5A-Za-z0-9_]+$- 中文、英文、数字但不包括下划线等符号：
^[\u4E00-\u9FA5A-Za-z0-9]+$或^[\u4E00-\u9FA5A-Za-z0-9]{2,20}$- 可以输入含有^%&’,;=?\"等字符：`[^%&',;=?\x22]+`
- 禁止输入含有~的字符：
[^~\x22]+
特殊需求表达式
- Email地址：
^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$- 域名：
[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(/.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+/.?- InternetURL：
[a-zA-z]+://[^\s]* 或 ^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$- 手机号码：
^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$- 电话号码(“XXX-XXXXXXX”、“XXXX-XXXXXXXX”、“XXX-XXXXXXX”、“XXX-XXXXXXXX”、"XXXXXXX"和"XXXXXXXX)：
^(\(\d{3,4}-)|\d{3.4}-)?\d{7,8}$- 国内电话号码(0511-4405222、021-87888822)：
\d{3}-\d{8}|\d{4}-\d{7}- 身份证号(15位、18位数字)：
^\d{15}|\d{18}$- 短身份证号码(数字、字母x结尾)：
^([0-9]){7,18}(x|X)?$或^\d{8,18}|[0-9x]{8,18}|[0-9X]{8,18}?$- 帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：
^[a-zA-Z][a-zA-Z0-9_]{4,15}$- 密码(以字母开头，长度在6~18之间，只能包含字母、数字和下划线)：
^[a-zA-Z]\w{5,17}$- 强密码(必须包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间)：
^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$- 日期格式：
^\d{4}-\d{1,2}-\d{1,2}- 一年的12个月(01～09和1～12)：
^(0?[1-9]|1[0-2])$- 一个月的31天(01～09和1～31)：
^((0?[1-9])|((1|2)[0-9])|30|31)$- xml文件：
^([a-zA-Z]+-?)+[a-zA-Z0-9]+\\.[x|X][m|M][l|L]$- 中文字符的正则表达式：
[\u4e00-\u9fa5]- 双字节字符：
[^\x00-\xff](包括汉字在内，可以用来计算字符串的长度(一个双字节字符长度计2，ASCII字符计1))- 空白行的正则表达式：
\n\s*\r(可以用来删除空白行)- HTML标记的正则表达式：
<(\S*?)[^>]*>.*?</\1>|<.*? />(网上流传的版本太糟糕，上面这个也仅仅能部分，对于复杂的嵌套标记依旧无能为力)- 首尾空白字符的正则表达式：
^\s*|\s*$或(^\s*)|(\s*$)(可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等)，非常有用的表达式)- 腾讯QQ号：
[1-9][0-9]{4,}(腾讯QQ号从10000开始)- 中国邮政编码：
[1-9]\d{5}(?!\d)(中国邮政编码为6位数字)- IP地址：
\d+\.\d+\.\d+\.\d+(提取IP地址时有用)- IP地址：
((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))
常用正则原文地址：http://www.cnblogs.com/zxin/archive/2013/01/26/2877765.html
案例
验证手机号
var tel = `15267890123`
var preg = /^1(3|4|5|6|7|8|9)\d{9}$/
console.log(preg.test(tel))
html标签替换
将代码中的topic标签替换成strong标签
var html = `<p class="post_item_p"><p>五一去哪玩？？快来波拉哩星球！和大家一起嗨翻天！<img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><topic class="topic" data-id="4"><span contenteditable="false">#球球大作战#</span></topic> <topic class="topic" data-id="82"><span contenteditable="false">#五一狂欢节#</span></topic> <topic class="topic" data-id="16"><span contenteditable="false">#最爱球球沙雕表情包#</span></topic> </p></p>`
var preg = /<topic([^>]*)>([\w\W]*?)<\/topic\s*>/g
html = html.replace(preg, '<strong$1>$2</strong>')
计算字符数
计算代码中的字符数
规则：
- 图片算一个字符
- html标签不算字符
- 空格不算字符
// 匹配图片，替换成一个字符'$'
// 匹配html标签，去掉
// 匹配空格，去掉
// 使用str.length计算字符数
var html = `<p class="post_item_p"><p>五一去哪玩？？快来波拉哩星球！和大家一起嗨翻天！<img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><img class="face" src="https://cdn-ingame.superpopgames.com/ingame/community/dist/static/images/gulugulu/23.gif"><topic class="topic" data-id="4"><span contenteditable="false">#球球大作战#</span></topic> <topic class="topic" data-id="82"><span contenteditable="false">#五一狂欢节#</span></topic> <topic class="topic" data-id="16"><span contenteditable="false">#最爱球球沙雕表情包#</span></topic> </p></p>`
html = html.replace(/<img([^>]*)>/g, '$')
html = html.replace(/<[^>]+>/g, '')
html = html.replace(/\s+/g, '')
console.log(html.length)
字符串中取出地址
快手、抖音等小视频分享地址中取出url
var str = `情歌熙丫头发了一个快手作品，一起来看！ http://www.gifshow.com/s/nqA5NdrP 复制此链接，打开【快手】直接观看！`
var preg = /((ht|f)tps?):\/\/([\w\-]+(\.[\w\-]+)*\/)*[\w\-]+(\.[\w\-]+)*\/?(\?([\w\-\.,@?^=%&:\/~\+#]*)+)?/g
var arr = str.match(preg)
console.log(arr)
字符串中@处理
var str = '我们都是中国人呢@开大 @叔 我们都爱自己的 祖国 @www ddd'
var preg = /(@[^\s]+)\s/g
var arr = str.match(preg)
console.log(arr) // ["@开大 ", "@叔 ", "@www "]
var arr2 = str.split(preg)
console.log(arr2) // ["我们都是中国人呢", "@开大", "", "@叔", "我们都爱自己的 祖国 ", "@www", "ddd"]
发表评论