Fade away

Appearance

正则表达式 ​

  • 正则表达式（Regular Expression 简称：RegExp）

  • 正则表达式，又名 “规则表达式”，由我们自己来书写 “规则”，专门用来检测 字符串 是否符合 “规则” 使用的

  • 我们使用一些特殊的字符或者符号定义一个 “规则公式”，然后用我们定义好的 “规则公式” 去检测字符串是不是合格

  • 正则很抽象 都是一些符号 比较难以理解 https://goregex.cn/

一、创建正则表达式（对象） ​

  • 想制定 “规则”，必须要按照人家要求的方式来制定

  • 把一些字母和符号写在 / / 中间的东西，叫做正则表达式，比如 /abcdefg/

  • 创建正则表达式有两个方式 字面量 和 构造函数创建

1.1 字面量创建 ​

js
// 下面就是字面量创建一个正则表达式
var reg = /abcdefg/;

1.2 构造函数创建 ​

js
// 下面就是构造函数创建一个正则表达式
var reg = new RegExp('abcdefg');
console.log(reg) //  /abcdefg/
  • 使用构造函数方式创建的和字面量创建的，得到的结果一样

二、正则表达式里面的符号 ​

知道了怎么创建一个正则表达式以后，我们就来详细的说一下正则表达式里面涉及到的一些符号了

2.1 元字符 ​

元字符描述
.匹配非换行的任意字符
\转译符号把有意义的 符号 转换成没有意义的字符，把没有意义的 字符 转换成有意义的 符号
\n换行
\t缩进
\b空格
\s匹配空白字符（空格/制表符/...）,缩进，回车
\S匹配非空白字符
\d匹配数字
\D匹配非数字
\w匹配数字、字母、下划线
\W匹配非数字、字母、下划线
\b匹配单词边界
\B匹配非单词边界
\0匹配NULL字符
\f匹配换页符
\r匹配回车符
js
var reg = /\s/
var str = 'a b'
var str2 = 'ab'
console.log(reg.test(str)) // true
console.log(reg.test(str2)) // false
js
var reg = /\d/
var str = 'abc1'
var str2 = 'abc'
console.log(reg.test(str)) // true
console.log(reg.test(str2)) // false
js
var reg = /\w/
var str = 'a1'
var str2 = '#@$'
console.log(reg.test(str)) // true
console.log(reg.test(str2)) // false

2.2 限定符 ​

限定符描述
*前一个内容重复至少 0 次，也就是可以出现 0 ～ 正无穷 次
+前一个内容重复至少 1 次，也就是可以出现 1 ～ 正无穷 次
?前一个内容重复 0 或者 1 次，也就是可以出现 0 ～ 1 次
{n}前一个内容重复 n 次，也就是必须出现 n 次
{n,}前一个内容至少出现 n 次，也就是出现 n ～ 正无穷 次
{n,m}前一个内容至少出现 n 次至多出现 m 次，也就是出现 n ～ m 次

限定符是配合元字符使用的

js
// 下面正则表示验证数字出现 0 ～ 正无穷次都可以
var reg = /\d*/    
var str = 'abc'
var str2 = 'abc1'
var str3 = 'abc123'
console.log(reg.test(str)) // true    数字出现0次
console.log(reg.test(str2)) // true
console.log(reg.test(str3)) // true
js
// 下面正则表示验证数字出现 1 ～ 正无穷次都可以
var reg = /\d+/
var str = 'abc'
var str2 = 'abc1'
var str3 = 'abc123'
console.log(reg.test(str)) // false
console.log(reg.test(str2)) // true
console.log(reg.test(str3)) // true
js
// 下面正则表示验证数字出现 0 ~ 1 次都可以
var reg = /\d?/
var str = 'abc'
var str2 = 'abc1'
console.log(reg.test(str)) // true
console.log(reg.test(str2)) // true
js
// 下面正则表示验证数字必须出现 3 次
var reg = /\d{3}/
var str = 'abc'
var str2 = 'abc1'
var str3 = 'abc123'
console.log(reg.test(str)) // false
console.log(reg.test(str2)) // false
console.log(reg.test(str3)) // true
js
// 下面正则表示验证数字出现 3 ～ 正无穷次
var reg = /\d{3,}/
var str = 'abc'
var str2 = 'abc1'
var str3 = 'abc123'
var str4 = 'abcd1234567'
console.log(reg.test(str)) // false
console.log(reg.test(str2)) // false
console.log(reg.test(str3)) // true
console.log(reg.test(str4)) // true
js
// 下面正则表示验证数字只能出现 3 ～ 5 次
var reg = /\d{3,5}/
var str = 'abc'
var str2 = 'abc1'
var str3 = 'abc123'
var str4 = 'abc12345'
console.log(reg.test(str)) // false
console.log(reg.test(str2)) // false
console.log(reg.test(str3)) // true
console.log(reg.test(str4)) // true

2.3 边界符 ​

边界符描述
^匹配任何开头为 n 的字符串。
$匹配任何结尾为 n 的字符串
js
// 下面表示从开头到结尾只能有数字，并且出现 3 ～ 5 次
var reg = /^\d{3,5}$/
var str = 'abc'
var str2 = 'abc123'
var str3 = '1'
var str4 = '1234567'
var str5 = '123'
var str6 = '12345'
console.log(reg.test(str)) // false
console.log(reg.test(str2)) // false
console.log(reg.test(str3)) // false
console.log(reg.test(str4)) // false
console.log(reg.test(str5)) // true
console.log(reg.test(str6)) // true

2.4 特殊符号 ​

特殊符号描述
()限定一组元素
[]字符集合，表示写在 [ ] 里面的任意一个都行
[^]反字符集合，表示写在 [^] 里面之外的任意一个都行
-范围，比如 a-z 表示从字母 a 到字母 z 都可以
|或，正则里面的或 a

方括号的使用

表达式描述
[abc]查找方括号之间的任何字符。
[^abc]查找任何不在方括号之间的字符。
[0-9]查找任何从 0 至 9 的数字。
[a-z]查找任何从小写 a 到小写 z 的字符。
[A-Z]查找任何从大写 A 到大写 Z 的字符。
[A-z]查找任何从大写 A 到小写 z 的字符。
[adgk]查找给定集合内的任何字符。
[^adgk]查找给定集合外的任何字符。
(red|blue|green)查找任何指定的选项。
  • 现在我们就可以把若干符号组合在一起使用了
js
// 下面是一个简单的邮箱验证
// 非_$开头，任意字符出现至少6次，一个@符号，(163|126|qq|sina)中的任意一个，一个点，(com|cn|net)中的任意一个
var reg = /^[^_$].{6,}@(163|126|qq|sina)\.(com|cn|net)$/

2.5 标示符/修饰符 ​

修饰符描述
i不区分大小写
g执行全局匹配
m执行多行匹配

三、正则表达式的方法（RegExp对象） ​

正则提供了一些方法给我们使用，用来检测和捕获字符串中的内容的

3.1 test() ​

  • test是用来检测字符串是否符合正则的标准

  • 语法： reg.test(字符串)

  • 返回值： boolean

js
console.log(/\d+/.test('123')) // true
console.log(/\d+/.test('abc')) // false

3.2 exec() ​

  • exec是把字符串中符合条件的内容捕获出来

  • 语法： reg.exec(字符串)

  • 返回值： 把字符串中符合正则要求的第一项以及一些其他信息，以数组的形式返回

js
var reg = /\d{3}/
var str = 'hello123world456你好789'
var res = reg.exec(str)
console.log(res)

/*
 ["123", index: 5, input: "hello123world456你好789", groups: undefined]
    0: "123"
    groups: undefined
    index: 5
    input: "hello123world456你好789"
    length: 1
   __proto__: Array(0)
*/

  • 数组第 0 项就是匹配到的字符串内容

  • index 属性表示从字符串的索引几开始是匹配的到字符串

四、字符串方法 ​

字符串中有一些方法也可以和正则一起使用

4.1 search() ​

  • search是查找字符串中是否有满足正则条件的内容

  • 语法： 字符串.search(正则)

  • 返回值 ： 有的话返回开始索引，没有返回 -1

js
var reg = /\d{3}/
var str = 'hello123'
var str2 = 'hello'

console.log(str.search(reg)) // 5
console.log(str2.search(reg)) // -1

4.2 match() ​

  • match找到字符串中符合正则条件的内容返回

  • 语法： 字符串.match(正则)

  • 返回值 ：

    • 没有标示符 g 的时候，是和 exec 方法一样

    • 有标示符 g 的时候，是返回一个数组，里面是匹配到的每一项

js
var reg = /\d{3}/
var str = 'hello123world456'
var str2 = 'hello'

console.log(str.match(reg)) 
// ["123", index: 5, input: "hello123wor456", groups: undefined]
console.log(str2.match(reg)) // null
js
var reg = /\d{3}/g
var str = 'hello123world456'
var str2 = 'hello'

console.log(str.match(reg)) 
// ["123", "456"]
console.log(str2.match(reg)) // null

4.3 replace() ​

  • replace是将字符串中满足正则条件的字符串替换掉

  • 语法：字符串.replace(正则，要替换的字符串)

  • 返回值 ： 替换后的字符串

js
var reg = /\d{3}/
var str = 'hello123world456'
var str2 = 'hello'
console.log(str.replace(reg,"666")) // hello666world456
console.log(str2.replace(reg,"666")) // hello
js
var reg = /\d{3}/g
var str = 'hello123world456'
var str2 = 'hello'
console.log(str.replace(reg,"666")) // hello666world666
console.log(str2.replace(reg,"666")) // hello

MIT Licensed

Copyright © 2024-present xarzhi