放肆青春的博客
首页
前端
算法
网络
面试
技术
后端
运维
杂项
数据库
工具
网址
电脑
个人
文章
  • 分类
  • 标签
  • 归档
github (opens new window)
gitee (opens new window)

放肆青春

一个前端菜鸟的技术成长之路
首页
前端
算法
网络
面试
技术
后端
运维
杂项
数据库
工具
网址
电脑
个人
文章
  • 分类
  • 标签
  • 归档
github (opens new window)
gitee (opens new window)
  • 前端

    • 前端 概览
    • 前端汇总

      • 前端总结
      • 前端进阶博文
      • 前端文章
      • 正则表达式
        • 正则表达式
          • 正则表达式的组成
          • 正则表达式的创建
          • 正则的特性
          • 正则表达式回溯法
        • 正则字符
          • 元字符
          • 限定符
          • 描述字符范围
          • 边界量词
          • 运算符优先级
        • 正则方法
          • 正则相关的一些方法
          • 支持正则的字符串相关方法
        • 常用正则
          • 手机号匹配
          • 身份证号匹配
    • front 博文

    • front 项目总结

    • front 高级

    • front tools

  • vue

    • vue 概览
    • vue 汇总

    • vue 博文

    • vue 项目总结

    • vue 高级

  • html

    • html 概览
    • html 汇总

    • html 博文

  • css

    • css 概览
    • css 汇总

    • css 博文

    • sass

    • less

  • js

    • javascript 概览
    • JS 汇总

    • ES6

    • JS 博文

    • JS 工具

  • node

    • node 概览
    • node 汇总

    • node 框架

    • node 博文

  • react

    • react 概览
    • react 汇总

    • react 博文

    • react 高级

  • 微信小程序

    • 微信小程序 概览
    • 微信小程序总结
    • 微信小程序文章
    • 微信小程序 博文

    • 微信小程序 高级

  • 微信公众号

    • 微信公众号 概览
    • 微信公众号总结
    • 微信公众号文章
  • 多端开发

    • 多端开发
    • dsbridge 概览
    • jsbridge 概览
    • webview
    • uniapp

      • uniapp 概览
    • taro

      • taro 概览
    • flutter

      • flutter 概览
      • flutter 环境搭建
    • electron

      • electron 概览
  • front
放肆青春
2021-09-29

正则表达式

# 正则表达式

正则表达式是用于匹配字符串中字符组合的模式。在 JavaScript 中,正则表达式也是对象。这些模式被用于 RegExp 的 exec 和 test 方法, 以及 String 的 match、matchAll、replace、search 和 split 方法。

# 正则表达式的组成

JS 正则表达式中,都有字符字面量、字符组、量词、锚字符、分组、选择分支、反向引用。这些结构

  1. 字面量,匹配一个具体字符,包括不用转义的和需要转义的。比如 a 匹配字符"a",又比如\n匹配换行符,又比如\.匹配小数点。

  2. 字符组,匹配一个字符,可以是多种可能之一,比如[0-9],表示匹配一个数字。也有\d 的简写形式。另外还有反义字符组,表示可以是除了特定字符之外任何一个字符,比如[^0-9],表示一个非数字字符,也有\D 的简写形式。

  3. 量词,表示一个字符连续出现,比如 a{1,3}表示“a”字符连续出现 3 次。另外还有常见的简写形式,比如 a+表示“a”字符连续出现至少一次。

  4. 锚点,匹配一个位置,而不是字符。比如^匹配字符串的开头,又比如\b 匹配单词边界,又比如(?=\d)表示数字前面的位置。

  5. 分组,用括号表示一个整体,比如(ab)+,表示"ab"两个字符连续出现多次,也可以使用非捕获分组(?:ab)+

  6. 分支,多个子表达式多选一,比如 abc|bcd,表达式匹配"abc"或者"bcd"字符子串。

  7. 反向引用,比如\2,表示引用第 2 个分组。

# 正则表达式的创建

  1. 字面量创建方式 var reg = /pattern/modifiers,例子:

  2. 实例创建方式 var reg = new RegExp(pattern,modifiers);

    RegExp 对象是一个预定义了属性和方法的正则表达式对象。

    参数:

    pattern(模式) 描述了表达式的模式

    modifiers(修饰符) 用于指定全局匹配、区分大小写的匹配和多行匹配

# 正则的特性

  1. 贪婪性

所谓的贪婪性就是正则在捕获时,每一次会尽可能多的去捕获符合条件的内容。 如果我们想尽可能的少的去捕获符合条件的字符串的话,可以在量词元字符后加?

  1. 懒惰性

懒惰性则是正则在成功捕获一次后不管后边的字符串有没有符合条件的都不再捕获。 如果想捕获目标中所有符合条件的字符串的话,我们可以用标识符 g 来标明是全局捕获

var str = "123aaa456";
var reg = /\d+/; //只捕获一次,一次尽可能多的捕获
var res = str.match(reg);
console.log(res);
// ["123", index: 0, input: "123aaa456"]
reg = /\d+?/g; //解决贪婪性、懒惰性
res = str.match(reg);
console.log(res);
// ["1", "2", "3", "4", "5", "6"]
1
2
3
4
5
6
7
8
9

# 正则表达式回溯法

# 正则字符

# 元字符

\d : 0-9之间的任意一个数字  \d只占一个位置
\w : 数字,字母 ,下划线 0-9 a-z A-Z _
\s : 空格或者空白等
\D : 除了\d
\W : 除了\w
\S : 除了\s
 . : 除了\n之外的任意一个字符
 \ : 转义字符
 | : 或者
() : 分组
\n : 匹配换行符
\b : 匹配边界 字符串的开头和结尾 空格的两边都是边界 => 不占用字符串位数
 ^ : 限定开始位置 => 本身不占位置
 $ : 限定结束位置 => 本身不占位置
[a-z] : 任意字母 []中的表示任意一个都可以
[^a-z] : 非字母 []中^代表除了
[abc] : abc三个字母中的任何一个 [^abc]除了这三个字母中的任何一个字符
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# 限定符

  1. * : 0到多个

  2. + : 1到多个

  3. ? : 0次或1次 可有可无

  4. {n} : 正好n次;

  5. {n,} : n到多次

  6. {n,m} : n次到m次

# 描述字符范围

在正则表达式语法中,放括号表示字符范围。在方括号中可以包含多个字符,表示匹配其中任意一个字符。如果多个字符的编码顺序是连续的,可以仅指定开头和结尾字符,省略中间字符,仅使用连字符~表示。如果在方括号内添加脱字符^前缀,还可以表示范围之外的字符。例如:

[abc]:查找方括号内任意一个字符。
[^abc]:查找不在方括号内的字符。
[0-9]:查找从 0 至 9 范围内的数字,即查找数字。
[a-z]:查找从小写 a 到小写 z 范围内的字符,即查找小写字母。
[A-Z]:查找从大写 A 到大写 Z 范围内的字符,即查找大写字母。
[A-z]:查找从大写 A 到小写 z 范围内的字符,即所有大小写的字母。

1
2
3
4
5
6
7

# 边界量词

边界就是确定匹配模式的位置,如字符串的头部或尾部,具体说明如表所示。

  1. ^ 匹配开头,在多行检测中,会匹配一行的开头

  2. $ 匹配结尾,在多行检测中,会匹配一行的结尾

(1) 匹配最后一个单词

var s = "how are you";
var r = /\w+$/;
var a = s.match(r); //返回数组["you"]
1
2
3

(2) 匹配第一个单词

var r = /^\w+/;
var a = s.match(r); //返回数组["how"]
1
2

(3) 匹配每一个单词

var r = /\w+/g;
var a = s.match(r); //返回数组["how","are","you"]
1
2

# 运算符优先级

正则表达式从左到右进行计算,并遵循优先级顺序,这与算术表达式非常类似。

相同优先级的从左到右进行运算,不同优先级的运算先高后低。下表从最高到最低说明了各种正则表达式运算符的优先级顺序:

运算符 描述
\ 转义符
(), (?:), (?=), [] 圆括号和方括号
*, +, ?, {n}, {n,}, {n,m} 限定符
^, $, \任何元字符、任何字符 定位点和序列(即:位置和顺序)
字符具有高于替换运算符的优先级,使得"m food"匹配"m"或"food"。若要匹配"mood"或"food",请使用括号创建子表达式,从而产生"(m

# 正则方法

# 正则相关的一些方法

  1. reg.test(str) 用来验证字符串是否符合正则 符合返回 true 否则返回 false
var str = "abc";
var reg = /\w+/;
console.log(reg.test(str)); //true
1
2
3
  1. reg.exec() 用来捕获符合规则的字符串,该函数返回一个数组,其中存放匹配的结果。如果未找到匹配,则返回值为 null。

# 支持正则的字符串相关方法

  1. str.match(reg) 如果匹配成功,就**返回匹配成功的数组**,如果匹配不成功,就返回 null

  2. str.replace(reg, char) 正则去匹配字符串,匹配成功的字符去替换成新的字符串,返回替换成功的字符串

var str = "a111bc222de";
var res = str.replace(/\d/g, "Q");
console.log(res);
// "aQQQbcQQQde"
1
2
3
4
  1. str.search(reg) 方法 用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串,并**返回子串的起始位置**。
var str = "Visit Runoob!";
var n = str.search(/Runoob/i);
// 6
1
2
3
  1. str.split(reg, limit) 用于把一个字符串分割成字符串数组。返回一个字符串数组

limit:可选。该参数可指定返回的数组的最大长度。如果设置了该参数,返回的子串不会多于这个参数指定的数组。如果没有设置该参数,整个字符串都会被分割,不考虑它的长度。

# 常用正则

# 手机号匹配

# 身份证号匹配


参考:js 中正则表达式使用 (opens new window)

更新时间: 12/17/2021, 6:07:16 PM
前端文章
移动端兼容

← 前端文章 移动端兼容→

最近更新
01
前端权限管理
02-24
02
vue2指令
02-24
03
vue2 hook
02-24
更多文章>
Theme by Vdoing | Copyright © 2019-2022 放肆青春
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式