JS(正则表达式)

1. 正则表达式基础

  • 定义:用于描述、匹配字符串模式的表达式

  • 作用:文本搜索、替换、验证和提取

  • 语法/pattern/modifiers

2. 正则表达式构成

组成部分 说明 示例
定界符 通常使用/ /abc/
元字符 特殊含义的字符 . * + ? ^ $
模式修正符 匹配模式修饰 i g m

3. 元字符分类

原子筛选方式

| 元字符 | 描述 | 示例 |
|----------|-------------|------------------|---|---|
| [abc] | 匹配方括号内任意字符 | [aeiou] 匹配元音字母 |
| [^abc] | 匹配不在方括号内的字符 | [^0-9] 匹配非数字 |
| [a-z] | 匹配范围内的字符 | [0-9] 匹配数字 |
| `x | y` | 匹配x或y |||

原子集合(预定义字符类)

元字符 描述 等价于
. 匹配除换行符外任意字符 -
\d 匹配数字 [0-9]
\D 匹配非数字 [^0-9]
\s 匹配空白字符 [ \t\n\r\f\v]
\S 匹配非空白字符 [^ \t\n\r\f\v]
\w 匹配单词字符 [a-zA-Z0-9_]
\W 匹配非单词字符 [^a-zA-Z0-9_]

原子数量限定

元字符 描述 示例
{n} 匹配恰好n次 \d{3} 匹配3位数字
{n,} 匹配至少n次 \d{2,} 匹配至少2位数字
{n,m} 匹配n到m次 \d{2,4} 匹配2-4位数字
* 匹配0次或多次 a* 匹配0个或多个a
+ 匹配1次或多次 a+ 匹配1个或多个a
? 匹配0次或1次 a? 匹配0个或1个a

边界控制

元字符 描述 示例
^ 匹配字符串开始 ^abc 匹配以abc开头的字符串
$ 匹配字符串结束 xyz$ 匹配以xyz结尾的字符串
\b 匹配单词边界 \bword\b 匹配独立单词word
\B 匹配非单词边界 \Bword\B 匹配非独立单词word

4. 模式修正符

修饰符 描述
i 不区分大小写匹配
g 全局匹配(查找所有匹配)
m 多行匹配

5. 常用正则表达式示例

用途 正则表达式
非空验证 /\S+/
邮箱验证 /[\w-]+@([\w-]+\.)+[a-zA-Z]{2,}/
手机号验证 /^1[3-9]\d{9}$/
URL验证 /^https?:\/\/([\w-]+\.)+\S+$/
汉字匹配 /[\u4e00-\u9fa5]/
日期格式 /\d{4}[-/.]\d{1,2}[-/.]\d{1,2}/
身份证号 /\d{15}(\d{2}[0-9X])?/
用户名 /^[a-zA-Z]\w{5,17}$/

6. JavaScript正则方法

RegExp对象方法

方法 描述 示例
test() 检测是否匹配 /\d+/.test("123") → true
exec() 执行匹配搜索 /\d+/.exec("abc123")"123"

String对象方法

方法 描述 示例
match() 查找匹配 "123abc".match(/\d+/)"123"
replace() 替换匹配 "abc".replace(/a/, "A") → "Abc"
search() 搜索匹配位置 "abc".search(/b/) → 1
split() 按模式分割 "a,b,c".split(/,/)"a","b","c"

7. 高级技巧

  • 贪婪匹配 :默认尽可能多匹配(.+

  • 非贪婪匹配 :尽可能少匹配(.+?

  • 分组捕获 :使用()捕获匹配内容

  • 反向引用 :使用\1引用第一个分组

8. 实用示例

javascript 复制代码
// 手机号验证
function validatePhone(phone) {
    return /^1[3-9]\d{9}$/.test(phone);
}

// 提取所有数字
function extractNumbers(text) {
    return text.match(/\d+/g) || [];
}

// 邮箱验证
function validateEmail(email) {
    return /^[\w-]+@([\w-]+\.)+[a-zA-Z]{2,}$/.test(email);
}

// 替换日期格式
function formatDate(dateStr) {
    return dateStr.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1年$2月$3日");
}
复制代码
相关推荐
学习星球15 小时前
Solid.js 实战:拆解官方 RealWorld 项目
开发语言·javascript·vue.js
OPEN-F15 小时前
Python进阶教程:正则表达式进阶与文本处理
开发语言·python·正则表达式
YuJie16 小时前
JSBridge 基础知识
前端·javascript
默_笙16 小时前
🍕 后端接口还没写好,前端已经跑起来了?Mock 数据 + axios 接口层,前后端再也不互相"等"
前端·javascript
爱勇宝17 小时前
客户只想看个页面,我却做了一个静态演示发布系统
前端·javascript·后端
公子小六18 小时前
基于.NET的Windows窗体编程之WinForms音频控件
windows·microsoft·c#·.net·音视频·winforms
绿浪198419 小时前
c# 结构体 能不能直接封送检测
开发语言·c#
新手unity自用笔记19 小时前
unity基于Socket的网络学习
网络·网络协议·学习·unity·c#·游戏引擎
界面开发小八哥20 小时前
界面控件DevExpress Blazor v26.1新版亮点 - Navigation(导航)
javascript·.net·界面控件·blazor·devexpress·ui开发
格林威20 小时前
C#图像像素放大:邻域平均、双线性插值实现像素放大的C#实现代码
开发语言·人工智能·数码相机·计算机视觉·c#·视觉检测·工业相机