正则表达式

正则表达式(Regular Expression,简称regex或regexp)是一种用于匹配字符串中字符组合的模式 。在编写复杂的字符串处理逻辑时,正则表达式提供了强大的工具,使得文本搜索、文本替换、数据验证等操作变得更加简便和高效。以下是正则表达式的详细讲解,包括基本概念、常用符号和一些高级用法。

基本概念

  • 字符:正则表达式中的字符可以是字母、数字、标点符号以及特殊字符。
  • 元字符 :在正则表达式中有特殊含义的字符,如.*+?^、`$

(续)和\等。

  • 模式:由字符和元字符组成的字符串,用于定义搜索模式。

常用符号和语法

字符匹配
  • 普通字符 :如 ab1A 等,直接匹配对应的字符。
  • 点号 . :匹配除换行符 \n 以外的任何单个字符。
  • 字符类 [] :匹配方括号内的任意一个字符。例如,[abc] 匹配 abc
    • 字符范围 :如 [a-z] 匹配任何小写字母,[0-9] 匹配任何数字。
    • 排除字符类 [^] :如 [^a-z] 匹配任何不是小写字母的字符。
预定义字符类
  • \d:匹配任何数字,相当于 [0-9]
  • \D:匹配任何非数字字符,相当于 [^0-9]
  • \w:匹配任何单词字符(字母、数字、下划线),相当于 [A-Za-z0-9_]
  • \W:匹配任何非单词字符,相当于 [^A-Za-z0-9_]
  • \s:匹配任何空白字符,包括空格、制表符、换页符等。
  • \S:匹配任何非空白字符。
量词
  • *:匹配前面的字符零次或多次。
  • +:匹配前面的字符一次或多次。
  • ?:匹配前面的字符零次或一次。
  • {n}:匹配前面的字符恰好 n 次。
  • {n,}:匹配前面的字符至少 n 次。
  • {n,m}:匹配前面的字符至少 n 次,至多 m 次。
边界匹配
  • ^:匹配字符串的开头。
  • $:匹配字符串的结尾。
  • \b:匹配单词边界。
  • \B:匹配非单词边界。
分组和捕获
  • 圆括号 () :用于分组,将括号内的内容视为一个整体。也用于捕获匹配的内容。
    • 例如,(abc)+ 匹配 abcabcabc 等。
  • 反向引用 :使用 \1, \2 等来引用分组捕获的内容。
    • 例如,(\d)\1 匹配两个连续相同的数字,如 1122
或操作符 |
  • a|b:匹配 ab
    • 例如,cat|dog 匹配 catdog

高级用法

零宽断言
  • 正向先行断言 (?=...) :匹配某个位置后面是指定的内容,但不包含在匹配结果中。
    • 例如,\d(?=px) 匹配 3px 中的 3
  • 负向先行断言 (?!...) :匹配某个位置后面不是指定的内容。
    • 例如,\d(?!px) 匹配 3em 中的 3
  • 正向后行断言 (?<=...) :匹配某个位置前面是指定的内容,但不包含在匹配结果中。
    • 例如,(?<=\$)\d+ 匹配 $100 中的 100
  • 负向后行断言 (?<!...) :匹配某个位置前面不是指定的内容。
    • 例如,(?<!\$)\d+ 匹配 100 而不匹配 $100 中的 100

常见示例

  1. 匹配电子邮件地址

    复制代码
    /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/
  2. 匹配电话号码

    复制代码
    /^(\+\d{1,3}[- ]?)?\d{10}$/
  3. 匹配网址

    复制代码
    /^(https?:\/\/)?(www\.)?[a-zA-Z0-9-]+\.[a-zA-Z]{2,6}\/?$/

在Javascript中的使用

复制代码
// 创建正则表达式
let regex = /hello/;
let regex2 = new RegExp('hello');

// 测试字符串是否匹配正则表达式
console.log(regex.test('hello world')); // true

// 匹配字符串
let str = 'hello world';
let result = str.match(regex);
console.log(result); // ['hello']

// 替换字符串中的匹配部分
let newStr = str.replace(regex, 'hi');
console.log(newStr); // 'hi world'

⭐⭐附加⭐⭐

10分钟快速掌握正则表达式_哔哩哔哩_bilibili

var reg = /正则表达式/修饰符;

修饰符:

  • i: ignoreCase, 匹配忽视大小写
  • m: multiline , 多行匹配
  • g: global , 全局匹配
限定符
或运算符
  • (ab|cd) ab或cd
  • a (dog|cat) a dog 或a cat
字符类
  • a-c\] \[a-c\] a或b或c

  • \^0-9\]非数字 **此处\^表示非**

元字符

|------|------------------------------------------------------------|
| [] | var reg = /[abc]/;//匹配abc任意一个字符 var reg1 = /abc/;//匹配abc |
| ^ | var reg1 = /[^abc]/;//匹配abc之外的字符 |
| ^ | var reg = /^abc/;//匹配以abc开头的字符 |
| | var reg = /abc/;//匹配以abc结尾的字符 |
| . | 匹配除换行符以外的任意字符 |
| \w | 匹配字母或数字或下划线或汉字 |
| \s | 匹配任意的空白符 |
| \d | 匹配数字 |
| \b | 匹配单词的开始或结束 |

相关推荐
FuckPatience37 分钟前
Vue ASP.Net Core WebApi 前后端传参
前端·javascript·vue.js
一枚前端小能手1 小时前
🔥 SSR服务端渲染实战技巧 - 从零到一构建高性能全栈应用
前端·javascript
Komorebi_99991 小时前
Vue3 provide/inject 详细组件关系说明
前端·javascript·vue.js
不一样的少年_1 小时前
【前端效率工具】:告别右键另存,不到 50 行代码一键批量下载网页图片
前端·javascript·浏览器
Asort1 小时前
JavaScript设计模式(八):组合模式(Composite)——构建灵活可扩展的树形对象结构
前端·javascript·设计模式
木觞清2 小时前
喜马拉雅音频链接逆向实战
开发语言·前端·javascript
一枚前端小能手2 小时前
「周更第6期」实用JS库推荐:InversifyJS
前端·javascript
叉歪2 小时前
纯前端函数,一个拖拽移动、调整大小、旋转、缩放的工具库
javascript
Hilaku2 小时前
"事件委托"这个老古董,在现代React/Vue里还有用武之地吗?
前端·javascript·vue.js
向葭奔赴♡2 小时前
前端框架学习指南:提升开发效率
前端·javascript·vue.js