JavaScript常用正则表达式大全

正则表达式是处理字符串验证、查找、替换 的神器,我整理了前端开发中最常用、最实用 的正则,附带校验代码,直接复制到项目里就能用。

一、基础校验类(表单必备)

1. 手机号校验(国内 11 位手机号)

javascript 复制代码
const phoneReg = /^1[3-9]\d{9}$/;
// 使用示例
console.log(phoneReg.test('13800138000')); // true
  • 规则:以 1 开头,第二位 3-9,后面 9 位数字。

2. 邮箱校验(通用标准)

javascript 复制代码
const emailReg = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$/;
console.log(emailReg.test('test@163.com')); // true

3. 身份证号(18 位,支持校验最后一位 X)

javascript 复制代码
const idCardReg = /(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
console.log(idCardReg.test('11010119900307456X')); // true

4. 密码强度校验

  • 简单密码:6-16 位字母 / 数字 / 下划线

    ini 复制代码
    const pwdSimpleReg = /^\w{6,16}$/;
  • 强密码:必须包含大小写字母 + 数字 + 特殊字符,8-20 位

    scss 复制代码
    const pwdStrongReg = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,20}$/;

5. 验证码(6 位纯数字)

ini 复制代码
const codeReg = /^\d{6}$/;

二、数字格式类

1. 纯数字(正整数 / 负整数 / 0)

ini 复制代码
const numberReg = /^-?\d+$/;

2. 正整数

ini 复制代码
const positiveIntReg = /^[1-9]\d*$/;

3. 浮点数(支持正负小数)

ini 复制代码
const floatReg = /^-?\d+(.\d+)?$/;

4. 金额(最多 2 位小数)

ini 复制代码
const moneyReg = /^\d+(.\d{1,2})?$/;

三、文本格式类

1. 中文校验

ini 复制代码
const chineseReg = /^[\u4e00-\u9fa5]+$/;

2. 英文 / 字母校验

ini 复制代码
const letterReg = /^[a-zA-Z]+$/;

3. 用户名(4-16 位,字母 / 数字 / 中文)

ini 复制代码
const usernameReg = /^[a-zA-Z0-9\u4e00-\u9fa5]{4,16}$/;

4. URL 网址校验

javascript 复制代码
const urlReg = /^(https?://)?([\da-z.-]+).([a-z.]{2,6})([/\w.-]*)*/?$/;

5. 邮政编码(6 位数字)

ini 复制代码
const zipReg = /^\d{6}$/;

四、常用处理类(替换 / 提取)

1. 去除所有空格

ini 复制代码
let str = '  123 456  ';
str = str.replace(/\s+/g, ''); // 结果:'123456'

2. 手机号中间 4 位打码

ini 复制代码
let phone = '13800138000';
phone = phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2'); // 138****8000

3. 数字千分位格式化(123456 → 123,456)

ini 复制代码
let num = '12345678';
num = num.replace(/\B(?=(\d{3})+(?!\d))/g, ','); // 12,345,678

4. 提取字符串中的所有数字

ini 复制代码
let str = '价格199元,库存50件';
let nums = str.match(/\d+/g); // [199, 50]

五、JS 正则核心方法(必记)

  1. 正则表达式基础语法
  • ^表示字符串的开始,$表示字符串的结束
  • \d匹配一个数字,等价于0-9
  • \w匹配一个字母或数字字符,等价于A-Za-z0-9
  • +匹配前面的子表达式一次或多次。例如,\d+匹配一个或多个数字
  1. 正则表达式修饰符
  • i:执行不区分大小写的匹配
  • g:执行全局匹配(查找所有而非第一个匹配项)
  • m:执行多行匹配
  1. JavaScript中使用正则表达式的方法:
  • test()方法:正则.test(字符串) → 返回 true/false
  • exec()方法:在字符串中执行一个搜索匹配,返回一个结果数组或null
  • 字符串方法: match()字符串.match(正则) → 返回匹配结果数组 replace()字符串.replace(正则, 新内容) split():使用正则表达式分割字符串

总结

  1. 表单校验优先用:手机号、邮箱、身份证、密码、验证码正则
  2. 数字处理用:纯数字、金额、千分位正则
  3. 文本处理用:去空格、手机号打码、提取数字正则
  4. 所有正则直接复制,搭配 test() 方法即可完成校验
相关推荐
随风一样自由14 小时前
【前端独角兽】刚进入前端领域的前端开发用jQuery还是Vue3?
前端·javascript·vue3·jquery
IMPYLH14 小时前
HTML 的 <data> 元素
前端·html
YHHLAI15 小时前
[特殊字符] 面试中的 Promise —— 从入门到精通
前端·javascript·面试
weixin_BYSJ198715 小时前
SpringBoot + MySQL 乒乓球运动员信息管理系统项目实战--附源码04954
java·javascript·spring boot·python·django·flask·php
沪飘大军16 小时前
ll-llm:一个零依赖、可插拔的 OpenAI 兼容 LLM 代理
javascript
kyriewen17 小时前
我扒了 GPT-5.6 的全部编程跑分——有一项 OpenAI 没敢放出来
前端·gpt·ai编程
前端H17 小时前
微前端 v3 架构升级:从加载隔离到状态协同
前端·架构·状态模式
山河木马17 小时前
GPU自动处理专题3-NDC怎么映射成屏幕像素坐标(视口变换)
javascript·webgl·图形学
陆枫Larry18 小时前
小程序包体积优化:用 SVG 图片替换 iconfont,并保留 CSS 控色能力
前端
Appthing19 小时前
在 TanStack Start 中使用 VitePWA 的正确配置
javascript