正则表达式

46 阅读1分钟

1. 创建正则表达式

- 字面量方式  
let reg = /+86\d{11}/g

- 构造函数方式创建  
let name = 'jirengu'  
let reg = new RegExp('www.'+name+'.com', 'g')  
let reg = /+86\d{11}/g
  • g :全文搜索,不添加的话搜索到第一个结果停止搜索
  • i : 忽略大小写,默认大小写敏感
  • m:多行搜索

2. 专用字符

•具有特殊意义的字符  

[ { \ ^ $ | ) ? * + .  
如果要匹配这些特殊字符,需要转义\

3. 正则表达式的几种规则

单字符匹配

- [abcd]    匹配一个字符,是a b c d中的任意一个  
- [0-9]     匹配一个是09的数字  
- [a-zA-Z]  匹配一个不限制大小写的字母  
- [^abc]    表示一个不是字符ab或c的字符
let reg = /jirengu/  
console.log( reg.test('hello jirengu') )  // true 

let reg2 = /#[0-9a-f][0-9a-f][0-9a-f]/  
console.log( reg2.test('x#0f0x') ) //true  
console.log( reg2.test('x#h8jx') ) //  false  

let reg3 = /[Jj]irengu/  
console.log( reg3.test('hi jirengu') ) //  true  
console.log( reg3.test('hi Jirengu') ) //  true

console.log(/\[hello\]/.test('[hello]') ) //  true

预定义匹配

-  . 等价于[^\r\n],匹配一个除回⻋  和换行以为的任意字符
- \d 等价于[0-9],匹配一个数字字符
- \D 等价于[^0-9], 匹配一个非数字字符
- \s 等价于[空格\t\n\r\v\f],匹配一个空白字符
- \S 等价于[^空格\t\n\r\v\f],匹配一个非空白字符
- \w 等价于[a-zA-Z_0-9],匹配一个字母、数字、下划线
- \W 等价于[^a-zA-Z_0-9],匹配一个非单词字符
let str = 'he-llo jirengu, hello world'
let arr1 = str.split(/\s/)
console.log(arr1) //['he-llo', 'jirengu,', 'hello', 'world']

let arr2 = str.split(/\W/).filter(v => v!=='')
console.log(arr2) //['he', 'llo', 'jirengu', 'hello', 'world']

let str2 = str.replace(/\s/g, '')
console.log(str2) //"he-llojirengu,helloworld"

0个或多个

?   前面的字符出现0次或者1次  
+   前面的字符出现1次或者多次  
*   前面的字符出现0次或者多次  
{n} 前面的字符出现n次  
{n,m} 前面的字符出现n到m次  
{n,} 前面的字符出现至少n次
let reg1 = /\d{11}/  
console.log( reg1.test('12345678901') ) //true

let reg2 = /\d{2,4}/ //注意逗号后没空格  
console.log( reg2.test('1234') ) //true

let reg3 = /https?:\/\/jirengu\.com/  
console.log( reg3.test('https://jirengu.com') )//true  
console.log( reg3.test('http://jirengu.com') )//true

边界

- /^xyz/ 以xyz开头  
- /abc$/ 以abc结尾  
- /\babc\b/ 匹配是单词的abc(左右两侧是字符串开头、结尾、中横线、空格)  
- /\Babc\B/ 匹配不是单词的abc
let str = 'hello1 world hello2 123456 ruoyu hello3'  
str.match(/hello\d/g) // ["hello1", "hello2", "hello3"]  
str.match(/^hello\d/g) // ["hello1"]  
str.match(/hello\d$/g) // ["hello3"]

let str2 = 'hello1 whello9orld hello2 12-hello8-3456 jirengu ruoyu hello3'  
str2.match(/\bhello\d\b/g) //["hello1", "hello2", "hello8", "hello3"]  
//注意-也用于区分单词边

贪婪模式与非贪婪模式

默认是贪婪模式,即尽可能多的匹配。如果想使用非贪婪模式,可以再量词后加 ?即可

let str = '123456789'  
let reg1 = /\d{3,5}/g  
console.log( str.match(reg1) ) //['12345', '6789']

let reg2 = /\d{3,5}?/g  
console.log( str.match(reg2) ) //['123', '456', '789']

4. 案例

  1. 判断用户输入是否为手机号
let reg = /^1\d{10}$/  
reg.test(' 13189890989') //false  
reg.test('a13189890989b') //false

reg.test('13189890989') // true  
reg.test('1318989098910') // false
  1. 把与之匹配的字符串拿出来
const text = '图片的尺寸是1440x900';  
const reg = /(\d+)x(\d+)/;  
const match = text.match(reg);  
console.log(match[1], match[2])

const text = `图片1的尺寸是1440x900, 图片2的尺寸是800x600`;  
const reg = /(\d+)x(\d+)/g;  
const match = text.matchAll(reg);  
console.log([...match])
  1. 对于右侧HTML字符串,提取里面所有的a链接href里的内容
let str =
`<div>  
<link rel="stylesheet"  
href="http://jirengu.com/  
style.css">  
<a title="百度" href="https://baidu.com">百度</a><a href="http://jirengu.com" target="_blank">饥人谷  
</a>  
</div>`

let reg = /<a.+?href="(.+?)"/g  
let arr = [...str.matchAll(reg)]  
console.log(arr)  
let urls = arr.map(v => v[1])  
console.log(urls)