JavaScript 正则表达式基础:声明、模式与常用方法详解
本文系统介绍 JavaScript 中正则表达式的核心概念,涵盖字面量与构造函数两种声明方式,详细解析 g、i、m 三种匹配模式的差异与应用场景,并深入讲解 test() 与 exec() 方法的返回值结构及子表达式捕获机制,辅以常见字符串验证案例。
正则表达式的构成与声明方式
正则表达式主要由两个部分构成:
一是定义正则表达式的规则;
二是正则表达式的模式(i/g/m);
在 JavaScript 中,声明正则表达式主要有两种方式:
第一种是字面量声明法,语法为 var reg = /表达式规则/表达式模式;例如:var reg = /white/g;
第二种是使用 new 关键字,语法为 var reg = new RegExp("表达式规则","表达式模式");例如:var reg = new RegExp("white","g");
正则表达式的三种匹配模式
正则表达式支持三种不同的匹配模式:
第一种是 g(全局匹配)。如果不添加 g 标志,默认是非全局匹配,即只匹配第一个符合要求的字符串;
示例:"www".replace(/w/ ,"#"); 结果为 #ww; "www".replace(/w/g,"#"); 结果为 ###;
第二种是 i(忽略大小写)。如果不添加 i 标志,默认区分大小写,即大写必须匹配大写;
示例: "aAa".replace( /A/ ,"#"); 结果为 a#a; "aAa".replace( /A/i ,"#"); 结果为 #Aa; "aAa".replace( /A/gi ,"#"); 结果为 ###;
第三种是 m(多行匹配模式)。如果不带 m 标志,则整个字符串只有一个开头和一个结尾;带上 m 后,如果字符串包含多行,则每一行都有独立的开头和结尾。
示例: `abc`#bc abc`.replace(/^a/g,"#") 结果为 abc`= `abc``#bc abc`.replace(/^a/gm,"#") 结果为 #bc`
关于如何书写多行字符串:
在普通字符串中,插入 \n 表示换行,例如 "abc\nabc"。 在 ES6 中,允许使用反引号 ` 包裹字符串。反引号包裹的字符串会保留空格与回车。 例如: `abc abc`
正则表达式的常用方法
正则表达式在 JavaScript 中有两个常用方法:
第一种是 test():用于检测一个字符串是否符合正则表达式的验证。该方法返回 true 或 false; 示例: /white/.test("whitewhitewhite"); 结果为 true
第二种是 exec():用于检测一个字符串是否符合正则表达式的验证。如果验证成功,返回结果数组;如果验证失败,返回 null;
在返回的结果数组中:
index 属性表示从字符串的第几个字符开始符合正则要求;
input 属性返回完整的被检索的字符串;
下标第 0 个元素表示符合整个正则表达式的那部分字符串;
下标的第一个到第 n 个元素表示符合正则的第一个到第 n 个子表达式的部分。子表达式即正则中的 ()。也就是说,正则中有几个 (),结果数组中就有几个对应的下标。
示例: /12(3)(4)5/.exec("aaa12345"); [ 0:12345; 1:3; 2:4; index:3; input:"aaa12345"; length:3 ]
正则表达式的基本应用案例
以下是正则表达式的一些基本应用案例:
首先是验证邮政编码。
结果为:
其次是验证手机号。
结果为:
第三是验证年龄在 0-120 岁之间。

第四是验证域名,格式如 http://xxxxx.xxxx.com。
var http = /^(http|https):\/\/([A-Za-z0-9\-]+\.){2}[A-Za-z]{2,4}(\.[A-Za-z]{2,4})?$\/;
第五是验证 IP 地址,格式如 0.123.11.255。

var ip = /^((\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])\.){3}(\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])$/;
以上这篇简单谈谈JS中的正则表达式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持本站。
JS语法错误会阻止加载吗?区分SyntaxError与资源加载失败
2026-11-05 16:08:46
JavaScript常见SyntaxError语法错误排查与修复方法
2026-11-05 13:58:44
JS中slice、substring和substr截取字符串的区别
2026-11-05 13:43:47
JS 转 TS 手动迁移最佳实践:从配置 tsconfig 到消除 any 类型
2026-11-05 11:53:32
为什么JS数组push后得到的是数字而不是数组?
2026-11-05 09:59:18
