正则表达式（Regular Expression）是 JavaScript 中处理字符串的强大工具，用于匹配、搜索、替换和验证文本模式。以下是 JavaScript 中最常用的正则表达式模式及其应用场景。
一、常用正则表达式模式（Pattern）
1. 字符匹配
| 模式 | 说明 | 示例 |
|---|
. | 匹配任意单个字符（除换行符） | /a.c/ 匹配 “abc”, “a2c” |
\d | 匹配数字（等价于 [0-9]） | /\d+/ 匹配 “123” |
\D | 匹配非数字 | /\D+/ 匹配 “abc” |
\w | 匹配单词字符（字母、数字、下划线 _） | /\w+/ 匹配 “hello_123” |
\W | 匹配非单词字符 | /\W+/ 匹配 “!@#” |
\s | 匹配空白字符（空格、制表符、换行符等） | /\s+/ 匹配多个空格 |
\S | 匹配非空白字符 | /\S+/ 匹配非空字符 |
[abc] | 匹配括号内的任意一个字符 | /[aeiou]/ 匹配元音字母 |
[^abc] | 匹配不在括号内的任意字符 | /[^0-9]/ 匹配非数字 |
2. 量词（Quantifiers）
| 模式 | 说明 | 示例 |
|---|
* | 匹配0 次或多次 | /a*/ 匹配 “”, “a”, “aaa” |
+ | 匹配1 次或多次 | /a+/ 匹配 “a”, “aa”（不匹配 “”） |
? | 匹配0 次或 1 次 | /colou?r/ 匹配 “color” 或 “colour” |
{n} | 匹配恰好 n 次 | /\d{3}/ 匹配 “123” |
{n,} | 匹配至少 n 次 | /\d{2,}/ 匹配 “12”, “123” |
{n,m} | 匹配n 到 m 次 | /\d{2,4}/ 匹配 “12”, “123”, “1234” |
3. 位置锚点（Anchors）
| 模式 | 说明 | 示例 |
|---|
^ | 匹配字符串开头 | /^Hello/ 匹配以 “Hello” 开头的字符串 |
$ | 匹配字符串结尾 | /world$/ 匹配以 “world” 结尾的字符串 |
\b | 匹配单词边界 | /\bcat\b/ 匹配 “cat” 但不匹配 “category” |
\B | 匹配非单词边界 | /\Bcat\B/ 匹配 “education” 中的 “cat” |
4. 分组与捕获
| 模式 | 说明 | 示例 |
|---|
(pattern) | 捕获分组，匹配并捕获内容 | /(abc)+/ 匹配 “abcabc”，捕获 “abc” |
(?:pattern) | 非捕获分组，匹配但不捕获 | /(?:abc)+/ 匹配但不保存分组 |
| | 或 操作符 | /cat|dog/ 匹配 “cat” 或 “dog” |
二、常用正则表达式实例
1. 验证手机号（中国大陆）
const phoneRegex = /^1[3-9]\d{9}$/;
// 以 1 开头，第二位是 3-9，共 11 位数字
console.log(phoneRegex.test("13812345678")); // true
2. 验证邮箱
const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
// 简化版，实际应用可能更复杂
console.log(emailRegex.test("user@example.com")); // true
3. 验证身份证号（18位）
const idRegex = /^\d{17}[\dXx]$/;
// 17位数字 + 最后一位数字或 X/x
console.log(idRegex.test("11010519491231002X")); // true
4. 验证密码强度（至少8位，包含大小写字母和数字）
const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d@$!%*?&]{8,}$/;
// 正向先行断言：至少一个小写、一个大写、一个数字，总长至少8位
console.log(passwordRegex.test("MyPass123")); // true
5. 匹配 URL
const urlRegex = /^https?:\/\/[^\s$.?#].[^\s]*$/;
// 匹配 http 或 https 开头的 URL
console.log(urlRegex.test("https://example.com")); // true
6. 去除字符串首尾空白
const trimRegex = /^\s+|\s+$/g;
" hello world ".replace(trimRegex, ""); // "hello world"
// 注：实际开发中更推荐使用 String.trim()
7. 匹配 HTML 标签（简单示例）
const tagRegex = /<([^>]+)>/g;
// 匹配尖括号内的内容
"<p>Hello</p>".match(tagRegex); // ["<p>", "</p>"]
三、JavaScript 正则相关方法
| 方法 | 说明 |
|---|
regex.test(str) | 返回 true/false，检查是否匹配 |
regex.exec(str) | 返回匹配结果数组（包含捕获组）或 null |
str.match(regex) | 返回所有匹配项的数组（全局匹配）或详细信息（非全局） |
str.search(regex) | 返回第一个匹配项的索引，未找到返回 -1 |
str.replace(regex, replacement) | 替换匹配的文本 |
str.split(regex) | 使用正则作为分隔符分割字符串 |
四、修饰符（Flags）
| 修饰符 | 说明 |
|---|
g | 全局匹配（查找所有匹配，而非第一个） |
i | 忽略大小写 |
m | 多行模式（^ 和 $ 匹配每行的开始/结束） |
u | Unicode 模式（正确处理 Unicode 字符） |
s | dotAll 模式（. 匹配包括换行符在内的所有字符） |
示例：/\d+/g 全局匹配所有数字序列。
总结
掌握常用正则表达式模式（\d, \w, *, +, ?, ^, $, {n,m}）和典型应用场景（验证、搜索、替换）是前端开发的必备技能。
虽然正则功能强大，但也应避免编写过于复杂的正则，以免影响可读性和性能。在实际项目中，对于邮箱、URL 等复杂验证，建议使用成熟的第三方库。
