通俗易懂的正则表达式

正则表达式的英文是regular expression简称regex。正则表达式就是用事先定义好的一些特定字符、及这些特定字符的组合,组成一个"规则字符串",并让计算机用这个规则去检索符合规则的文本。

创建正则表达式

1、利用RegExp new RegExp('expression')

2、双反斜杠 / expression /

属性解释:

1、g 匹配全局

2、 i 忽略大小写

元字符:元字符是正则表达式中的特殊字符,用于定义某种特定的匹配模式

元字符 含义
. 匹配任意单个字符(除换行符)
* 匹配前面的字符零次或多次
+ 匹配前面的字符一次或多次
? 匹配前面的字符零次或一次
^ 匹配字符串的开头
$ 匹配字符串的结尾
[] 匹配括号内的任意字符(字符集)
() 分组,括号内的内容作为一个整体匹配
\ 转义符,表示将元字符转换为普通字符

量词: 量词用于控制匹配的次数,指定某个模式出现的次数范围

量词 含义
. 匹配任意单个字符(除换行符)
* 匹配前面的字符零次或多次
+ 匹配前面的字符一次或多次
{n} 匹配前面的模式正好 n 次
{n,} 匹配前面的模式至少 n 次
{n,m} 匹配前面的模式至少 n 次,至多 m 次

. 的用法

表示可以匹配任意一个字符

javascript 复制代码
var reg = /a.b/
console.log(reg.test("abbb"))  // true
console.log(reg.test("ahbb"))  // true
console.log(reg.test("aahb"))  // true
console.log(reg.test("ahb"))   // true
console.log(reg.test("ahhb"))  // true

*的用法

表示*前面的字符匹配0次或多次

javascript 复制代码
var regs = /a*b/
console.log(regs.test("aaaab"))      // true
console.log(regs.test("ab"))         // true
console.log(regs.test("arrrb"))      // true
console.log(regs.test("grrrb"))      // true
console.log(regs.test("grrrbfff"))   // true
console.log(regs.test("grrrt"))      // false
console.log(regs.test("grrrtb"))     // true
// 正则表达式中只有有其中一段字符串满足就可以 以上表达式代表只要a字符出现多次或0次都可以  所以只要有b就可以

+的用法

表示前面的字符匹配1次或多次

javascript 复制代码
var reg1 = /ab+c/
console.log(reg1.test('abbc1111111111'))  //true
console.log(reg1.test('abec1111111111'))  //false
console.log(reg1.test('abbchhh'))         //true

?的用法

表示前面的字符出现0次或1次

javascript 复制代码
var reg2 = /a?b/
console.log(reg2.test('b'))       //true
console.log(reg2.test('aab'))     //false
console.log(reg2.test('aaggg'))   //false
console.log(reg2.test('aaab'))    //false
console.log(reg2.test('ab'))      //true
console.log(reg2.test('haab'))    //true
console.log(reg2.test('ahab'))    //true

{n} 的用法

表示匹配前面字符正好n次

javascript 复制代码
var reg3 = /a{3}b/
console.log(reg3.test("ab"))     // false
console.log(reg3.test("aab"))    // false
console.log(reg3.test("aaab"))   // true
console.log(reg3.test("aaaab"))  // true
console.log(reg3.test("haaab"))  // true
console.log(reg3.test("haaac"))  // false

{n,} 的用法

表示匹配前面字符至少n次

javascript 复制代码
var reg4 = /a{3,}b/
console.log(reg4.test("ab"))        // false
console.log(reg4.test("aab"))       // false
console.log(reg4.test("aaab"))      // true
console.log(reg4.test("aaaab"))     // true
console.log(reg4.test("haaab"))     // true
console.log(reg4.test("haaac"))     // false
console.log(reg4.test("dddhaaab"))  // true

{n,m} 的用法

表示匹配前面的字符至少 n 次,至多 m 次

javascript 复制代码
var reg5 = /a{3,6}b/
console.log(reg5.test("aab"))       // false
console.log(reg5.test("aaab"))      // true
console.log(reg5.test("aaaab"))     // true
console.log(reg5.test("haaab"))     // true
console.log(reg5.test("haaac"))     // false
console.log(reg5.test("dddhaaab"))  // true

^的用法

表示设置字符串的开头

javascript 复制代码
var aaa = /^ab+c/
console.log(aaa.test("babc"))   // false
console.log(aaa.test("aabc"))   // false
console.log(aaa.test("abac"))   // false
console.log(aaa.test("abcc"))   // true
console.log(aaa.test("abbcc"))  // true

$的用法

表示设置字符串的开头

javascript 复制代码
var aaa = /ab+c$/
console.log(aaa.test("babc"))   // true
console.log(aaa.test("aabc"))   // true
console.log(aaa.test("abac"))   // false
console.log(aaa.test("abcc"))   // false
console.log(aaa.test("abbcc"))  // false

^和$搭配使用

javascript 复制代码
var aaa = /^ab+c$/
console.log(aaa.test("babc"))   // false
console.log(aaa.test("aabc"))   // false
console.log(aaa.test("abac"))   // false
console.log(aaa.test("abcc"))   // false
console.log(aaa.test("abbcc"))  // false
console.log(aaa.test("abbc"))   // true

[] 的使用

指定字符串的匹配规则,这个[]可以设置指定范围但是只占一个字符

javascript 复制代码
// 匹配单个字符
var aaa = /a[bBc]d/
console.log(aaa.test("abd"))     // true
console.log(aaa.test("aBd"))     // true
console.log(aaa.test("aCd"))     // false
console.log(aaa.test("abcd"))    // false
console.log(aaa.test("abded"))   // true

//从匹配区间匹配单个字符 
var aaa = /a[0-9]d/
console.log(aaa.test("a1bd"))      // false
console.log(aaa.test("a2d"))       // true
console.log(aaa.test("a34d"))      // false
console.log(aaa.test("a2d33"))     // true
console.log(aaa.test("34a2d33"))   // true

//单个匹配和匹配范围混用
var aaa = /a[bB0-9]d/
console.log(aaa.test("a1bd"))      // false
console.log(aaa.test("a2d"))       // true
console.log(aaa.test("aad"))       // false
console.log(aaa.test("a2d33"))     // true
console.log(aaa.test("34a2d33"))   // true

[]中使用^来取反

对[]中匹配的规则进行取反操作

javascript 复制代码
var aaa = /a[^0-9]d/
console.log(aaa.test("a1bd"))      // false
console.log(aaa.test("a2d"))       // false
console.log(aaa.test("aad"))       // true
console.log(aaa.test("afd33"))     // true
console.log(aaa.test("34afd33"))   // true

[]和{}搭配使用

javascript 复制代码
var aaa = /a[0-9]{2}d/
console.log(aaa.test("a1bd"))      // false
console.log(aaa.test("a2d"))       // false
console.log(aaa.test("a34d"))      // true
console.log(aaa.test("a345d"))     // false
console.log(aaa.test("wwa45ddd"))  // true

| 的使用

相当于或,可以在多个选项里面进行筛选筛选

javascript 复制代码
var aaa = /doc|xls|ppt|word/
console.log(aaa.test("doc"))      // true
console.log(aaa.test("adocf"))    // true
console.log(aaa.test("xls"))      // true
console.log(aaa.test("a345d"))    // false

\的使用

比如,现在需要写出js的变量命名规则:

以 、 或 字母开头,后面跟上 0 个或多个 、_ 或字母开头,后面跟上0个或多个 、或字母开头,后面跟上0个或多个、_、字母或数字。

javascript 复制代码
/^[\$_a-zA-Z][\$_0-9a-zA-Z]*$/i

因为 字符在正则表达式里是个特殊字符,所以要表达"匹配 字符在正则表达式里是个特殊字符,所以要表达"匹配 字符在正则表达式里是个特殊字符,所以要表达"匹配字符"的话就要把 字符转义,就是在 字符转义,就是在 字符转义,就是在前面加一个\,变成像.、+、\*、?、\^、、[、]、{、} 等等这些关键字符号,如果要匹配这些字符就要转义。

() 指定一个捕获组

括号除了可以匹配规则的优先级外,还可以充当"捕获组",比如要匹配的html标签
what可以写成 /<([a-z]+)>/.+<\/\1>/ \1 表示要完全匹配正则里第一个 () 里的规则的内容。 比如第一个 () 里的表达式匹配了body,那\1的部分也要完全匹配body捕获组

() 最多9个, \1 ~ \9 分别与这9个 () 按顺序一一对应

在replace中使用捕获组

捕获组也可以在replace里面用。比如要把 result = first + second - third 里的变量名前面都加上!

javascript 复制代码
console.log('result = first + second - third'.replace(/([a-z]+)/g, '!$1'))
//!result = !first + !second - !third

在replace的第二个参数里,利用是$1, $2, ... $9 引用捕获组。

但如果要把 result = first + second - third 里的变量名前面都加上$ 怎么办呢?

javascript 复制代码
console.log('result = first + second - third'.replace(/([a-z]+)/g, '$$1')) 
// $1 = $1 + $1 - $1

对于这种关键字的使用,需要在前面再加上$

javascript 复制代码
console.log('result = first + second - third'.replace(/([a-z]+)/g, '$$$1'))
// $result = $first + $second - $third

在exec中使用捕获组

使用正则的exec方法,可以取出exec中字符串匹配的部分

返回值是一个数组,数组的第一个参数是匹配到的字符串的结果,第二个参数是匹配到的第一捕获组的内容,数组的第n个参数是匹配到的捕获组的第n-1个内容,数组的倒数第2个元素是捕获组的起始下标,倒数第一个是被执行的字符串

javascript 复制代码
console.log(/<([a-z]+)>/.exec("111<br>222<br>333"))  
// ["<br>","br"] 
console.log(/^(\w+)\.(jpg|jpeg|bmp|png|gif)$/i.exec('_dsdddda.png')) 
// ["_dsdddda.png","_dsdddda","png"]

贪婪模式

*、+ 和 ? 的匹配属于贪婪模式

贪婪模式顾名思义就是尽可能多的去匹配,

例如/a.b/,.是符合贪婪模式的,尽可能多的匹配,所以是以来进行贪婪匹配,因为可以更多的匹配到字符串

javascript 复制代码
var bbb = "abcccccccbcc".replace(/a.*b/, 'Q')
console.log(bbb) //Qcc

非贪婪模式

顾名思义会尽可能少的匹配。做法就是在 *、+、? 的后面再加一个问号

javascript 复制代码
var bbb = 'abcccccccbcc'.replace(/a.*?b/, 'Q')
console.log(bbb) //Qcccccccbcc

常用的简写

  1. [0-9] 的简写 \d
    [0-9]{2, 6} 表示匹配2~6个数字, 可以写成 \d{2, 6}
  2. 空白符的简写 \s
    'H E L L O'.replace(/\s/g, '') --- "HELLO"
  3. 匹配_、数字或字母的简写 \w
    '_123ABC...:''.replace(/\w/g, 'Q') // QQQQQQQ...:

简写是区分大小写的,如果简写里面是大写 就代表取反的意思

如:'_123ABC...:''.replace(/\W/g, 'Q') // _123ABCQQQQ

相关推荐
zwjapple1 小时前
typescript里面正则的使用
开发语言·javascript·正则表达式
licy__1 天前
正则表达式语法详解(python)
数据库·mysql·正则表达式
风动也无爱1 天前
Java的正则表达式和爬虫
java·爬虫·正则表达式
运维小文2 天前
linux中的特殊符号
linux·正则表达式·shell·linux命令
南暮思鸢2 天前
强大的正则表达式——Hard
web安全·网络安全·正则表达式·交互式·write up·ctf比赛·hackergame 2024
赶紧回家去2 天前
正则表达式常用字符
正则表达式
白萝卜弟弟2 天前
【JAVA】正则表达式中的正向肯定预查
java·正则表达式
高锰酸钾_2 天前
Java 正则表达式详解及实用案例
java·正则表达式
追梦不止~2 天前
正则表达式
正则表达式
shidouyu3 天前
前端框架主要做些什么工作
javascript·css·ajax·正则表达式·json·firefox·jquery