前言
作为前端在日常开发过程中少不了会遇到各种需用用到 正则表达式 的时候，正则表达式 其实不难，搜索引擎一搜就出来了，但是有时候业务比较奇怪，那么就需要自己来改造一下，所以熟悉一下正则表达式的用法，能够看懂，能够修改 应该是前端开发必备的技能之一。
什么是正则表达式？
正则表达式（Regular Expressions，简称regex）是处理字符串的强大工具。它可以用来搜索、匹配和替换字符串中的特定模式。在JavaScript中，正则表达式非常常用。本篇文章将带你从基础开始，逐步了解并掌握JavaScript中的正则表达式。
正则表达式是一种用于描述字符串模式的特殊语法。它可以用于多种文本处理任务，如验证表单输入、查找和替换文本等。
创建正则表达式
在JavaScript中，可以通过两种方式创建正则表达式：
- 字面量方式：
const regex = /pattern/flags;
- 构造函数方式:
const regex = new RegExp('pattern', 'flags');
常用函数
test方法用于测试一个字符串是否匹配某个模式。
const regex = /hello/;
console.log(regex.test("hello world")); // true
console.log(regex.test("world")); // false
match方法用于在一个字符串中查找所有匹配的模式。
const regex = /o/g;
const str = "hello world";
console.log(str.match(regex)); // ["o", "o"]
replace方法用于替换匹配的子字符串。
const regex = /world/;
const str = "hello world";
const newStr = str.replace(regex, "JavaScript");
console.log(newStr); // "hello JavaScript"
split方法用于将字符串分割成数组。
const regex = /\s/;
const str = "hello world";
const arr = str.split(regex);
console.log(arr); // ["hello", "world"]
常用标志（flags）
g：全局搜索（global search），匹配所有可能的结果。i：忽略大小写（case-insensitive search）。m：多行模式（multi-line search），将字符串视为多行。
简单匹配
- 匹配一个具体的字符串：
const regex = /hello/;
const str = "hello world";
console.log(regex.test(str)); // true
- 忽略大小写匹配
/i
const regex = /hello/i;
const str = "Hello World";
console.log(regex.test(str)); // true
- 全局匹配
/g
const regex = /o/g;
const str = "hello world";
console.log(str.match(regex)); // ["o", "o"]
使用元字符
.：匹配除换行符外的任意字符。
const regex = /h.llo/;
console.log(regex.test("hello")); // true
\d：匹配一个数字（0-9）。
const regex = /\d/;
console.log(regex.test("abc123")); // true
\w：匹配一个字母、数字或下划线。
const regex = /\w/;
console.log(regex.test("hello_world")); // true
\s：匹配一个空白字符（空格、制表符等）。
const regex = /\s/;
console.log(regex.test("hello world")); // true
使用锚点
锚点用于指定匹配的开始和结束位置：
^：匹配字符串的开始。
const regex = /^hello/;
console.log(regex.test("hello world")); // true
console.log(regex.test("world hello")); // false
$：匹配字符串的结束。
const regex = /world$/;
console.log(regex.test("hello world")); // true
console.log(regex.test("world hello")); // false
使用量词
*：匹配前面的字符0次或多次。
const regex = /ho*/;
console.log(regex.test("hooo")); // true
console.log(regex.test("h")); // true
+：匹配前面的字符1次或多次。
const regex = /ho+/;
console.log(regex.test("hooo")); // true
console.log(regex.test("h")); // false
?：匹配前面的字符0次或1次。
const regex = /ho?/;
console.log(regex.test("ho")); // true
console.log(regex.test("h")); // true
{n}：匹配前面的字符n次。
const regex = /ho{2}/;
console.log(regex.test("hoo")); // true
console.log(regex.test("hooo")); // false
{n,}：匹配前面的字符至少n次。
const regex = /ho{2,}/;
console.log(regex.test("hoo")); // true
console.log(regex.test("hooo")); // true
{n,m}：匹配前面的字符n到m次。
const regex = /ho{2,3}/;
console.log(regex.test("hoo")); // true
console.log(regex.test("hooo")); // true
console.log(regex.test("hoooo")); // false
使用字符集
[]：匹配括号内的任意一个字符。
const regex = /h[aeiou]llo/;
console.log(regex.test("hello")); // true
console.log(regex.test("hollo")); // false
[^]：匹配不在括号内的任意字符。
const regex = /h[^aeiou]llo/;
console.log(regex.test("hallo")); // false
console.log(regex.test("hpllo")); // true
使用分组与反向引用
()：分组，用于捕获子字符串。
const regex = /(hello) (world)/;
const str = "hello world";
const result = str.match(regex);
console.log(result[0]); // "hello world"
console.log(result[1]); // "hello"
console.log(result[2]); // "world"
\n：反向引用，用于引用前面的分组。
const regex = /(hello) \1/;
console.log(regex.test("hello hello")); // true
高级用法零宽断言
- 先行断言（Positive Lookahead）：匹配某个字符序列前面的字符。
const regex = /hello(?= world)/;
console.log(regex.test("hello world")); // true
console.log(regex.test("hello there")); // false
- 先行否定断言（Negative Lookahead）：匹配某个字符序列前面不出现的字符。
const regex = /hello(?! world)/;
console.log(regex.test("hello world")); // false
console.log(regex.test("hello there")); // true
- 后行断言（Positive Lookbehind）：匹配某个字符序列后面的字符。
const regex = /(?<=hello )world/;
console.log(regex.test("hello world")); // true
console.log(regex.test("hi world")); // false
- 后行否定断言（Negative Lookbehind）：匹配某个字符序列后面不出现的字符。
const regex = /(?<!hello )world/;
console.log(regex.test("hello world")); // false
console.log(regex.test("hi world")); // true
正则表达式的实际应用
- 验证电子邮件地址
const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
console.log(emailRegex.test("test@example.com")); // true
console.log(emailRegex.test("invalid-email")); // false
- 验证电话号码
const telRegex = /^\d{3}-\d{3}-\d{4}$/;
console.log(telRegex.test("123-456-7890")); // true
console.log(telRegex.test("123-45-6789")); // false
- 验证手机号码
const phoneRegex = /^1[0-9]{10}$/;
console.log(phoneRegex.test("15202389657")); // true
console.log(phoneRegex.test("25202389657")); // false
- 提取网页URL中的域名
const url = "https://www.example.com/path?name=test";
const domainRegex = /^(?:https?:\/\/)?(?:www\.)?([^\/]+)/;
const match = url.match(domainRegex);
console.log(match[1]); // "example.com"
总结 :本文介绍了JavaScript正则表达式的基础知识和常用操作。通过学习这些内容，你可以轻松处理各种字符串操作。正则表达式是一个非常强大的工具，掌握它将极大地提升你的编程效率。 最后介绍一个非常好用的 正则表达式 实时查看网站
