引言（关于正则表达式，小黄人有话要说！！！）
掌握 JavaScript 正则表达式：从基础到高级，十个实用示例带你提升编程效率！
本文将带你逐步学习正则表达式的基础知识和高级技巧，从基本的元字符到实用的正则表达式示例，让你轻松掌握这一重要的编程技能。无论你是初学者还是有一定经验的开发者，这篇文章都能帮助你更好地理解和应用正则表达式。
如果您认为这篇文章对您有帮助或有价值，请不吝点个赞支持一下。如果您有任何疑问、建议或意见，欢迎在评论区留言。
如果你想快速入门 JavaScript 正则表达式，不妨点击这里阅读文章 "点燃你的前端技能！五分钟掌握JavaScript正则表达式"。
字面量和构造函数
在 JavaScript 中，我们可以使用正则表达式字面量或构造函数来创建正则表达式对象。
// 使用字面量
let regexLiteral = /pattern/;
// 使用构造函数
let regexConstructor = new RegExp('pattern');
正则表达式的方法
在 JavaScript 中，你可以使用正则表达式的方法进行模式匹配和替换。以下是一些常用的方法：
test()：测试一个字符串是否匹配正则表达式。const regex = /pattern/; regex.test('string'); // 返回 true 或 falseexec()：在字符串中执行正则表达式匹配，返回匹配结果的数组。const regex = /pattern/; regex.exec('string'); // 返回匹配结果的数组或 nullmatch()：在字符串中查找匹配正则表达式的结果，并返回匹配结果的数组。const regex = /pattern/; 'string'.match(regex); // 返回匹配结果的数组或 nullsearch()：在字符串中搜索匹配正则表达式的结果，并返回匹配的起始位置。const regex = /pattern/; 'string'.search(regex); // 返回匹配的起始位置或 -1replace()：在字符串中替换匹配正则表达式的内容。const regex = /pattern/; 'string'.replace(regex, 'replacement'); // 返回替换后的新字符串split()：将字符串根据匹配正则表达式的位置分割成数组。const regex = /pattern/; 'string'.split(regex); // 返回分割后的数组
基本元字符
正则表达式由字母、数字和特殊字符组成。其中，特殊字符被称为元字符，具有特殊的意义和功能。以下是一些常见的基本元字符及其作用：
元字符及其作用
字符类 []
- [abc]：匹配任意一个字符 a、b 或 c。
- [^abc]：匹配除了 a、b 或 c 之外的任意字符。
- [0-9]：匹配任意一个数字。
- [a-zA-Z]：匹配任意一个字母（大小写不限）。
转义字符 \
- \d：匹配任意一个数字字符。
- \w：匹配任意一个字母、数字或下划线字符。
- \s：匹配任意一个空白字符。
量词 {}
- {n}：匹配前一个元素恰好出现 n 次。
- {n,}：匹配前一个元素至少出现 n 次。
- {n,m}：匹配前一个元素出现 n 到 m 次。
边界字符 ^
- ^pattern：匹配以 pattern 开头的字符串。
- pattern$：匹配以 pattern 结尾的字符串。
- \b：匹配一个单词边界。
其他元字符
- .：匹配任意一个字符，除了换行符。
- |：用于模式的分组和逻辑 OR。
- ()：捕获分组，用于提取匹配的子字符串。
- ?:：非捕获分组，用于匹配但不捕获子字符串。
实例演示
现在，让我们通过一些实例来演示正则表达式中元字符的实际作用：
- 字符类 []
let regex = /[abc]/;
console.log(regex.test("apple")); // true
console.log(regex.test("banana")); // false
- 转义字符 \
let regex = /\d{3}-\d{4}/;
console.log(regex.test("123-4567")); // true
console.log(regex.test("abc-1234")); // false
- 量词 {}
let regex = /\d{2,4}/;
console.log(regex.test("123")); // true
console.log(regex.test("12345")); // false
console.log(regex.test("12")); // true
`
- 边界字符 ^
// 以什么开头
let regex = /^hello/;
console.log(regex.test("hello world")); // true
console.log(regex.test("world hello")); // false
// 单词边界
const pattern = /\bcat\b/;
console.log(pattern.test("The cat is black.")); // 输出：true
console.log(pattern.test("A cat is running.")); // 输出：true
console.log(pattern.test("The caterpillar is cute.")); // 输出：false
- 其他元字符
// 捕获分组与模式分组
let regex = /(red|blue) car/;
console.log(regex.test("I have a red car.")); // true
console.log(regex.test("I have a blue car.")); // true
console.log(regex.test("I have a green car.")); // false
// 点号元字符
const pattern = /a.b/;
console.log(pattern.test("acb")); // 输出：true
console.log(pattern.test("a1b")); // 输出：true
console.log(pattern.test("a@b")); // 输出：true
console.log(pattern.test("ab")); // 输出：false
修饰符的使用
修饰符用于改变正则表达式的匹配行为，常见的修饰符包括 g（全局）、i（不区分大小写）和 m（多行）。
// 使用 `g` 修饰符全局匹配
const regex = /a/g;
const str = "abracadabra";
console.log(str.match(regex)); // 输出：['a', 'a', 'a', 'a']
// 使用 `i` 修饰符进行不区分大小写匹配
const pattern = /abc/i;
console.log(pattern.test("AbcDef")); // 输出：true
console.log(pattern.test("XYZ")); // 输出：false
十个高度实用的正则表达式示例
- 验证电子邮件地址：
const emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$/;
console.log(emailPattern.test("example@example.com")); // 输出：true
console.log(emailPattern.test("invalid.email@com")); // 输出：false
- 验证手机号码：
const phonePattern = /^\d{11}$/;
console.log(phonePattern.test("12345678901")); // 输出：true
console.log(phonePattern.test("98765432")); // 输出：false
- 提取 URL 中的域名：
const url = "https://www.example.com";
const domainPattern = /^https?://([^/?#]+)(?:[/?#]|$)/i;
const domain = url.match(domainPattern)[1];
console.log(domain); // 输出："www.example.com"
- 验证日期格式（YYYY-MM-DD）：
const datePattern = /^\d{4}-\d{2}-\d{2}$/;
console.log(datePattern.test("2023-05-12")); // 输出：true
console.log(datePattern.test("12/05/2023")); // 输出：false
- 验证密码强度（至少包含一个大写字母、一个小写字母和一个数字）：
const passwordPattern = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).{8,}$/;
console.log(passwordPattern.test("Password123")); // 输出：true
console.log(passwordPattern.test("weakpassword")); // 输出：false
- 提取文本中的所有链接：
const text = "Visit my website at https://www.example.com. For more information, check out http://www.example.com/docs.";
const linkPattern = /https?://\S+/g;
const links = text.match(linkPattern);
console.log(links); // 输出：["[https://www.example.com](https://www.example.com/)", "<http://www.example.com/docs>"]
替换字符串中的所有数字为特定字符：
const text = "I have 3 apples and 5 oranges."; const digitPattern = /\d/g; const modifiedText = text.replace(digitPattern, "*"); console.log(modifiedText); // 输出："I have * apples and * oranges." `匹配 HTML 标签中的内容：
const html = "<p>Hello, <strong>world</strong>!</p>";
const tagPattern = /<[^>]+>/g;
const content = html.replace(tagPattern, "");
console.log(content); // 输出："Hello, world!"
- 检查字符串是否以特定后缀结尾：
const filename = "example.txt";
const suffixPattern = /.txt$/;
console.log(suffixPattern.test(filename)); // 输出：true
- 验证邮政编码（5 位或 5+4 位数字）：
const zipCodePattern = /^\d{5}(?:-\d{4})?$/;
console.log(zipCodePattern.test("12345")); // 输出：true
console.log(zipCodePattern.test("98765-4321")); // 输出：true
console.log(zipCodePattern.test("1234")); // 输出：false
通过正则表达式的核心概念和用法，结合实例和讲解。在实际开发中，不难发现正则表达式是一个强大的工具，可用于字符串处理、模式匹配和验证输入等方面。掌握正则表达式的技巧，可以大大提升 JavaScript 编程的效率和灵活性。
结语
感谢您的阅读！希望本文带给您有价值的信息。
如果对您有帮助，请「点赞」支持，并「关注」我的主页获取更多后续相关文章。同时，也欢迎「收藏」本文，方便以后查阅。
写作不易，我会继续努力，提供有意义的内容。感谢您的支持和关注！
