js中使用的正则表达式

摘要:日常开发中表单校验几乎离不开正则,本文整理开发高频用到的正则:手机号、身份证、邮箱、金额、账号密码、中文英文等,附带 JS 示例代码,直接复制即可使用。

前言

在前端做表单校验,正则表达式是最高效的手段。比如判断手机号格式、身份证、邮箱、金额、用户名密码、中文输入等场景。下面整理一套业务开发中经常复用的正则,每一条附带注释说明。

完整代码示例

复制代码
<script>
    let inputvalue = ''

    //1. 判断是否是正整数
    let reg1 = /^[1-9]*$/
    console.log(reg1.test(inputvalue))

    //2. 手机号码匹配 11位数字
    let reg2 = /^1[3-9]\d{9}$/
    console.log(reg2.test(inputvalue))

    //3. 身份证号匹配(18位)
    let reg3 = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
    console.log(reg3.test(inputvalue))

    //4. 邮箱匹配
    let reg4 = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
    console.log(reg4.test(inputvalue))

    //5. 金钱匹配(纯数字,保留两位小数)
    let reg5 = /^-?0|[1-9]\d*(\.\d{1,2})?$/
    console.log(reg5.test(inputvalue))

    //6. 匹配中文
    let reg6 = /^[\u4e00-\uufa5]+$/
    console.log(reg6.test(inputvalue))

    //7. 匹配英文
    let reg7 = /^[a-zA-Z]+$/
    console.log(reg7.test(inputvalue))

    //8. 匹配英文和数字
    let reg8 = /^[a-zA-Z0-9]+$/

    //9. 国内座机号码匹配
    let reg9 = /^0\d{2,3}-\d{7,8}$/

    //10. 用户账号匹配
    /*
     * 1.4‑16 位
     * 2.只能字母、数字、下划线
     * 3.不能以数字开头(必须字母开头)
     */
    const reg10 = /^[a-zA-Z][a-zA-Z0-9_]{3,15}$/
    console.log(reg10.test('admin 001'))
    console.log(reg10.test('001admin'))
    console.log(reg10.test('admin!'))

    //11.密码强度
    /*
     * 1.6‑20 位
     * 2.必须同时包含:字母 + 数字
     */
    const reg11 = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z0-9]{6,20}$/
    console.log(reg11.test('admin001'))
    console.log(reg11.test('001admin'))
    console.log(reg11.test('admin1111'))


    /**
     * 工具函数:提取字符串里面全部数字
     * @param str 原始字符串
     * @returns {*} 匹配到的数字数组
     */
    function getNum(str) {
        let reg = /\d+/g
        return str.match(reg)
    }
    console.log(getNum('订单号:ORD‑2026‑0727'))
    console.log(getNum('金额:599元'))


    /**
     * 判断是否是手机号
     * @param str 输入字符串
     */
    function isphone(str) {
        let reg_result = /^1[3-9]\d{9}$/.test(str)
        if (reg_result === true) {
            return console.log(`${str} 是手机号`)
        } else {
            return console.log(`${str} 不是手机号`)
        }
    }
    isphone('18888888888')
    isphone('12345678901')


    /**
     * 判断是否有效邮箱
     * @param str 输入字符串
     */
    function isemail(str) {
        let reg_result = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(str)
        if (reg_result === true) {
            return console.log(`${str} 是邮箱`)
        } else {
            return console.log(`${str} 不是邮箱`)
        }
    }
    isemail('12345678901@163.com')
    isemail('invalid‑email')


    /**
     * 从文本提取全部手机号
     * @param str 原始大段文本
     * @returns {*} 手机号数组
     */
    function gettPhone(str) {
        let reg = /1[3-9]\d{9}/g
        return console.log(str.match(reg))
    }
    gettPhone('手机号:18888888888,18888888894,18888888895')
    gettPhone('联系13800138001,备用13800138009')
</script>

核心 API 说明

  1. reg.test(str)

返回布尔值 true/false,检测字符串是否满足正则规则,表单校验最常用。

复制代码
let reg = /^1[3-9]\d{9}$/
let res = reg.test('13800138000')
console.log(res) // true
  1. str.match(reg)

将字符串中匹配到内容提取出来,返回数组,加修饰符g代表全局匹配。

复制代码
'abc123def456'.match(/\d+/g) // ["123","456"]

常用正则对照表

表格

校验场景 正则表达式
手机号 /^1[3-9]\d{9}$/
身份证 (18 位) `/^1-9\d{5}(18 19 (23\d))\d{2}((01-9) (10 11 12))((0-21-9) 10 20 30 31)\d{3}0-9Xx$/`
邮箱 /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
金额(最多两位小数) `/^-?0 1-9\d*(.\d{1,2})?$/`
纯中文 /^[\u4e00-\uufa5]+$/
账号(字母开头,4‑16 位,字母数字下划线) /^[a-zA-Z][a-zA-Z0-9_]{3,15}$/
密码(6‑20 位,字母 + 数字) /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z0-9]{6,20}$/

小坑提醒

  1. ^代表字符串开头,$代表字符串结尾,表单校验一定要带上,不然部分匹配会绕过校验。
  2. 全局匹配g修饰符,不要用在test(),会有状态残留问题,提取内容才用g。
  3. 身份证正则只做格式校验,业务严谨场景还需要后端进一步校验。
相关推荐
泡海椒7 分钟前
金融报表开发:jquick-pdf K 线图 PDF 可视化解决方案
java·开发语言·金融·pdf
孙启超20 分钟前
【AI开发之Rust】第 17 课:项目总览与核心架构 —— AI 助手 Rust 核心从 0 到 1
开发语言·后端·rust
u01110267529 分钟前
Vue 3 实现图片裁剪框:拖动、缩放与固定宽高比
前端·javascript·vue.js
FED_AF36 分钟前
Linux运维“邪修”功法之正则表达式
linux·运维·正则表达式
码匠许师傅43 分钟前
【C++三方组件】Asio 上篇:回调式 TCP 客户端与服务端
开发语言·c++·tcp/ip
神仙别闹1 小时前
基于C语言实现 TINY+ 编译器
c语言·开发语言·数据库
Wang's Blog1 小时前
Java 项目实战: 外卖平台优化-从库Slave配置与主从复制验证
java·开发语言
0nirvana01 小时前
从普通 script 到 ESM:一文搞懂 JavaScript 模块、IIFE 和 window
javascript
知识分享小能手1 小时前
C++ 学习教程,从入门到精通,C++内存模型和名称空间 — 详细知识点总结(9)
开发语言·c++·学习
2601_962218611 小时前
c++中多重继承与虚继承的实现
开发语言·c++