正则表达式基础

什么是正则表达式

正则表达式是一种强大的文本处理工具，在JavaScript中扮演着关键角色。它本质上是一串用于 匹配字符串中字符组合的模式 ，能够帮助开发者高效地进行文本搜索和替换操作。通过使用特殊的字符序列，正则表达式可以灵活地描述复杂的文本模式，从而实现精确的数据验证和文本分析。

在JavaScript中，正则表达式不仅是一种语法结构，还是一个功能丰富的对象，拥有多种方法如test()和exec()，这些方法使得开发者能够轻松地执行各种高级文本处理任务。这种设计使正则表达式成为JavaScript开发中不可或缺的一部分，广泛应用于表单验证、文本解析和数据清洗等领域。

创建正则表达式

在JavaScript中，创建正则表达式是文本处理的核心步骤。本节将详细介绍两种主要的创建方法：字面量语法和RegExp构造函数，并比较它们的优缺点。

字面量语法

字面量语法是最常见的创建正则表达式的方法。它的基本语法如下：

var regex = /pattern/flags;

其中，pattern是正则表达式的模式，flags是可选的标志字符串，用于指定正则表达式的行为。这种方法简洁直观，适合快速创建简单的正则表达式。

RegExp构造函数

RegExp构造函数提供了另一种创建正则表达式的方式：

var regex = new RegExp('pattern', 'flags');

这种方法虽然比字面量语法稍显繁琐，但它提供了一些额外的优势：

1. 更好的灵活性：允许动态构建正则表达式。

2. 支持变量插入：可以在模式中使用变量。

3. 提高安全性：适用于处理来自外部源的模式。

比较

特征	字面量语法	RegExp构造函数
语法简洁性	高	较低
动态构建	不支持	支持
变量插入	不支持	支持
安全性	较低	较高

示例

假设我们需要创建一个正则表达式来匹配用户输入的邮箱地址。使用字面量语法可能需要手动编写完整的模式：

var emailRegex = /^[\w.-]+@[a-zA-Z\d.-]+\.[a-zA-Z]{2,}$/;

而使用RegExp构造函数，我们可以更容易地引入变量或动态部分：

function createEmailRegex(domain) {
    return new RegExp('^[\w.-]+' + domain + '$');
}

var customEmailRegex = createEmailRegex('@example.com');

总结

选择哪种方法取决于具体需求。对于静态且简单的正则表达式，字面量语法更为合适。而对于需要动态构建或涉及复杂模式的情况，RegExp构造函数可能是更好的选择。理解这两种方法的特点，可以帮助开发者在实际项目中做出更明智的选择。

正则表达式语法

元字符

正则表达式中的元字符是具有特殊意义的字符，用于定义复杂的匹配规则。这些元字符大大增强了正则表达式的表达能力和灵活性。让我们深入了解几个常用的元字符及其应用场景：

1. . ：匹配任意单个字符（除换行符外）

2. \d ：匹配任意数字（相当于[0-9]）

3. \w ：匹配任意字母、数字或下划线（相当于[a-zA-Z0-9_]）

4. \s ：匹配任意空白字符（包括空格、制表符和换行符）

这些元字符简化了常见字符集的定义过程，提高了正则表达式的可读性和维护性。

此外，还有一些专门用于控制匹配位置的元字符：

• ^ ：匹配输入字符串的开始位置

• $ ：匹配输入字符串的结束位置

这些元字符常用于限定整个字符串的匹配范围，而非仅匹配部分内容。

为了更好地理解和应用这些元字符，让我们看一个实际的例子：

// 匹配一个简单的邮箱地址
var emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

if (emailPattern.test("example@example.com")) {
    console.log("Valid email");
} else {
    console.log("Invalid email");
}

在这个例子中，我们使用了以下元字符：

• ^ 和 $ ：限定整个字符串必须符合这个模式

• @ ：匹配邮箱中的@符号

• . ：匹配域名中的点号

• [^\s@] ：匹配除空格和@符号外的其他字符

通过合理组合这些元字符，我们可以构建出强大而灵活的正则表达式，有效应对各种文本匹配和处理的需求。

字符类

在正则表达式中，字符类是一个强大的特性，它允许我们指定一组期望匹配的字符。这不仅可以提高表达式的效率，还能显著增强其可读性和可维护性。

预定义字符类

JavaScript正则表达式提供了多个预定义的字符类，涵盖了常用的字符集合：

字符类	描述	等价于
\d	数字	[0-9]
\D	非数字	[^0-9]
\w	单词字符	[a-zA-Z0-9_]
\W	非单词字符	[^a-zA-Z0-9_]
\s	空白字符	[ \t\n\r\f\v]
\S	非空白字符	[^ \t\n\r\f\v]

这些预定义字符类极大地简化了常见字符集的定义过程。例如，要匹配一个包含数字和小写字母的密码，我们可以这样写：

var passwordPattern = /^\d+[a-z]+$/;

这里，\d代表至少一个数字，[a-z]代表至少一个小写字母。

自定义字符类

除了预定义的字符类，我们还可以创建自己的字符类。自定义字符类的基本语法是在方括号[]内放入想要匹配的字符。例如：

var vowelPattern = /[aeiou]/;

这个表达式会匹配任何一个元音字母。值得注意的是，方括号内的顺序不影响匹配结果。

自定义字符类还支持 取反 功能。只需在方括号内放置一个脱字号^，就可以匹配不在指定集合内的字符：

var nonVowelPattern = /[^aeiou]/;

这个表达式会匹配任何非元音字母的字符。

使用技巧

在实际应用中，合理结合预定义和自定义字符类可以构建出非常灵活的正则表达式。例如，要匹配一个美国电话号码（区号三位数，然后是三位数，最后四位数，中间可以用短横线或空格分隔），我们可以这样写：

var phonePattern = /^\d{3}[- ]?\d{3}[- ]?\d{4}$/;

这个表达式利用了\d预定义字符类和自定义数量限制，同时结合了可选的短横线或空格分隔符。

通过熟练运用字符类，我们可以构建出既简洁又高效的正则表达式，大大提高文本处理的效率和准确性。

量词

量词是正则表达式中用于控制匹配次数的重要组成部分。它们允许我们指定模式元素应该出现的最小和最大次数，从而增加了表达式的灵活性和精确度。以下是几种常用的量词类型及其特点：

1. 星号(*) ：表示匹配零次或多次。例如，a*可以匹配空字符串或任意多个"a"。

2. 加号(+) ：表示匹配一次或多次。例如，a+要求至少有一个"a"出现。

3. 问号(?) ：表示匹配零次或一次。例如，a?允许"a"出现或不出现。

4. 大括号({}) ：提供更精细的匹配控制。具体来说：

• {n}：匹配恰好n次

• {n,}：匹配至少n次

• {n,m}：匹配至少n次，但不超过m次

这些量词的使用可以显著提高正则表达式的精确度和效率。例如，要匹配一个美国电话号码（区号三位数，然后是三位数，最后四位数，中间可以用短横线或空格分隔），我们可以使用以下表达式：

var phonePattern = /^\d{3}[- ]?\d{3}[- ]?\d{4}$/;

在这个例子中，\d{3}表示匹配三位数字，[- ]?使用了问号量词，表示短横线或空格是可选的。

量词的一个重要特性是 贪婪与非贪婪匹配 。默认情况下，量词是贪婪的，即它们会尽可能多地匹配字符。例如，.*会匹配尽可能多的任意字符。然而，有时我们需要更精细的控制，这时可以在量词后面加上问号(?)，将其变成非贪婪模式。非贪婪模式下的量词会尽可能少地匹配字符。

假设我们有一个字符串<div>content</div>，使用<.*>会匹配整个字符串，而<.*?>只会匹配到第一个>。

通过合理使用这些量词，我们可以构建出更加灵活和精确的正则表达式，以满足各种复杂的文本匹配需求。在实际应用中，选择合适的量词类型和贪婪性级别对于优化正则表达式的性能和准确度至关重要。

正则表达式方法

test和exec方法

在探讨正则表达式方法时，test()和exec()这两个方法无疑是最基础也是最常用的。它们为开发者提供了强大的工具，用于在字符串中查找匹配正则表达式的模式。让我们深入了解这两个方法的工作原理和应用场景。

test()方法

test()方法用于检测一个字符串是否包含与给定正则表达式相匹配的文本。它的语法简单明了：

let result = pattern.test(string);

其中，pattern是正则表达式对象，string是要被搜索的字符串。如果找到匹配，test()返回true；否则返回false。

这个方法特别适合用于简单的匹配判断，例如验证用户输入是否符合某种格式。假如我们要检查一个字符串是否是有效的电子邮件地址，可以这样使用test()方法：

let email = "example@example.com";
let emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
console.log(emailPattern.test(email)); // 输出: true

exec()方法

相比之下，exec()方法的功能更为强大。它不仅返回匹配的结果，还提供更多关于匹配的详细信息。exec()方法的语法如下：

let result = pattern.exec(string);

如果找到匹配，exec()返回一个包含匹配信息的数组；如果没有找到匹配，则返回null。这个数组的第一个元素是完整匹配的字符串，随后的元素是各个捕获组的匹配结果。此外，数组还有index和input两个属性，分别表示匹配的起始位置和被搜索的原始字符串。

exec()方法的一个独特之处在于它可以用于 全局匹配 。当正则表达式包含全局标志g时，exec()可以从上次匹配结束的位置继续搜索新的匹配。这使得它非常适合处理需要多次匹配的场景，例如提取一个字符串中的所有电话号码：

let phonePattern = /\d{3}-\d{3}-\d{4}/g;
let text = "Call me at 123-456-7890 or 987-654-3210";
let result;

while ((result = phonePattern.exec(text)) !== null) {
    console.log(result);
}

这段代码会输出：

123-456-7890
987-654-3210

使用场景

在实际应用中，选择使用test()还是exec()通常取决于具体需求：

• 简单匹配判断 ：test()方法更为合适，因为它只关心是否存在匹配，而不关注匹配的具体内容。

• 需要详细匹配信息 或 进行多次匹配 ：exec()方法是更好的选择。

通过合理使用这两个方法，开发者可以根据不同的文本处理需求，选择最适合的工具来完成任务，从而提高代码的效率和可维护性。

String对象的正则方法

在JavaScript中，String对象提供了几个强大的方法，可以与正则表达式配合使用，实现高效的文本处理和模式匹配。这些方法分别是match()、search()和replace()。让我们深入了解这些方法的工作原理和应用场景。

match()方法

match()方法用于在字符串中查找与正则表达式匹配的子串。它的基本语法如下：

let result = string.match(regexp);

match()方法的行为受正则表达式标志的影响：

• 无g标志 ：返回一个包含匹配结果的数组，或null（未找到匹配）

• 含g标志 ：返回所有匹配的子串组成的数组

例如：

let str = "Hello, hello, HELLO!";
let pattern = /hello/i;
console.log(str.match(pattern)); // ["Hello"]

在这个例子中，/hello/i是一个不区分大小写的正则表达式。match()方法成功找到匹配，并返回一个包含匹配结果的数组。

search()方法

search()方法用于检测字符串中是否存在与正则表达式匹配的子串。它的语法如下：

let position = string.search(regexp);

search()方法返回匹配的起始位置，如果没有找到匹配则返回-1。这个方法特别适合用于简单的存在性检查：

let str = "Hello, hello, HELLO!";
let pattern = /hello/i;
console.log(str.search(pattern)); // 0

replace()方法

replace()方法用于在字符串中替换与正则表达式匹配的子串。它的语法如下：

let newString = string.replace(searchValue, replaceValue);

replace()方法接受两个参数：要被替换的子串（可以是字符串或正则表达式）和替换后的值。如果使用正则表达式作为searchValue，可以实现更复杂的替换逻辑：

let str = "Hello, hello, HELLO!";
let pattern = /hello/gi;
let replaced = str.replace(pattern, "Hi");
console.log(replaced); // "Hi, Hi, HI!"

在这个例子中，/hello/gi是一个全局且不区分大小写的正则表达式。replace()方法成功替换了所有匹配的子串。

值得注意的是，replace()方法的第二个参数可以是一个函数。这个函数会在每次匹配时被调用，返回替换后的字符串：

let str = "Hello, hello, HELLO!";
let pattern = /hello/gi;
let replaced = str.replace(pattern, function(match) {
    return match.toUpperCase();
});
console.log(replaced); // "HELLO, HELLO, HELLO!"

这个例子展示了如何使用函数参数实现更复杂的替换逻辑，例如将所有匹配转换为大写。

通过巧妙结合这些String对象的正则方法，开发者可以实现各种复杂的文本处理任务，如数据清洗、格式化和验证等。这些方法的灵活性和强大功能使它们成为JavaScript字符串操作的有力工具。

高级技巧

分组和捕获

在正则表达式中，分组和捕获是两项强大的技术，能够显著增强表达式的灵活性和功能性。这两者紧密相连，共同构成了正则表达式的核心机制之一。

分组

分组是通过使用圆括号()将正则表达式的一部分包围起来的操作。这不仅能让表达式更加模块化和易于理解，还能改变量词的应用范围。例如：

let pattern = /(ab)+c/;
console.log(pattern.test("ababc")); // 输出: true
console.log(pattern.test("abc")); // 输出: false

在这个例子中，(ab)作为一个整体被重复了一次或多次，然后跟上一个c。这种结构让正则表达式变得更加灵活和精确。

捕获组

捕获组是分组的一种特殊形式，它不仅能匹配文本，还能将匹配的结果保存下来供后续使用。捕获组按照它们在表达式中出现的顺序进行编号，从1开始。这些被捕获的内容可以通过exec()方法的返回数组或replace()方法的替换字符串中引用。

let str = "Hello, hello, HELLO!";
let pattern = /hello/gi;
let result;

while ((result = pattern.exec(str)) !== null) {
    console.log(result);
}

// 输出:
// Hello
// hello
// HELLO!

在这个例子中，result总是包含整个匹配的字符串，而后面的元素则对应于捕获组的内容。这种机制使得开发者可以轻松地访问和处理匹配的不同部分。

命名捕获组

ES2018引入了命名捕获组的概念，进一步增强了正则表达式的可读性和可维护性。命名捕获组使用(?'name'...)或(?\u003cname\u003e...)语法定义，允许开发者为捕获组指定有意义的名称，而不是依赖于难以记忆的数字索引。

let datePattern = /(?\u003cday\u003e\\d{2})-(?\u003cmonth\u003e\\d{2})-(?\u003cyear\u003e\\d{4})/;
let dateString = "25-04-2017";

let match = dateString.match(datePattern);

if (match) {
    let { day, month, year } = match.groups;
    console.log(`${month}/${day}/${year}`);
}

这个例子展示了如何使用命名捕获组来解析日期字符串。通过为每个捕获组赋予有意义的名称，代码的可读性和可维护性都得到了显著提高。在处理复杂的正则表达式时，这种命名机制尤为重要，它可以使代码更加清晰易懂。

通过合理使用分组和捕获，开发者可以构建出更加灵活和精确的正则表达式，从而实现复杂的文本处理和模式匹配任务。这些技术不仅提高了正则表达式的表达能力，还增强了代码的可读性和可维护性，使得复杂的文本处理工作变得更加高效和可靠。

零宽断言

零宽断言是正则表达式中一项强大的高级技巧，它允许我们在不消耗任何字符的情况下进行模式匹配。这项技术通过在匹配位置之前或之后设置条件，实现了对匹配行为的精确控制，从而解决了许多传统正则表达式难以处理的问题。

零宽断言主要包括四种类型：

1. 正向前瞻 ((?=...))

2. 负向前瞻 ((?!...))

3. 正向后顾 ((<=...))

4. 负向后顾 ((<!=...))

这些断言的核心思想是在匹配过程中检查目标字符串的相邻位置，而不会实际“消耗”这些位置的字符。这种机制使得正则表达式能够实现更加复杂和精确的匹配逻辑。

正向前瞻

正向前瞻(?=...)用于匹配紧随其后的模式，但不包括该模式本身。例如：

let str = "Hello, hello, HELLO!";
let pattern = /hello(?=123)/gi;
console.log(str.match(pattern)); // 输出: null

在这个例子中，尽管"hello"出现了三次，但由于紧跟其后的不是"123"，所以没有匹配结果。

负向前瞻

负向前瞻(?!...)则刚好相反，用于匹配不紧随其后的模式。例如：

let str = "Hello, hello, HELLO!";
let pattern = /hello(?!123)/gi;
console.log(str.match(pattern)); // 输出: ["hello", "hello"]

这个例子中，由于"hello"后面都不是"123"，因此匹配了两次"hello"。

正向后顾

正向后顾(<=...)用于匹配紧接在其之前的模式，同样不包括该模式本身。例如：

let str = "abc123def";
let pattern = /(<=abc)123/;
console.log(str.match(pattern)); // 输出: ["123"]

在这个例子中，“123”被匹配，因为它紧接在"abc"之后。

负向后顾

负向后顾(<!=...)则用于匹配不紧接在其之前的模式。例如：

let str = "abc123def";
let pattern = /(<!abc)123/;
console.log(str.match(pattern)); // 输出: null

这个例子中，由于"123"前面不是"abc"，因此没有匹配结果。

通过合理运用这些零宽断言，我们可以构建出更加灵活和精确的正则表达式，解决许多复杂的匹配问题。例如，在验证密码强度时，我们可以使用零宽断言来确保密码同时包含字母、数字和特殊字符：

let passwordPattern = /^(?=.*[a-zA-Z])(?=.*\\d)(?=.*[!@#$%^&*()])[a-zA-Z\\d!@#$%^&*()]{8,}$/;

这个表达式使用了正向前瞻来检查密码是否包含至少一个字母、一个数字和一个特殊字符，同时保证了密码的整体长度在8到无穷之间。这种复杂的匹配逻辑充分展示了零宽断言的强大能力，使得正则表达式能够处理更加复杂的文本匹配需求。

修饰符

修饰符是正则表达式中用于改变匹配行为的关键元素。它们通过在正则表达式模式的末尾添加特定的字符来扩展和定制匹配规则，从而提供更灵活和精确的文本处理能力。以下是JavaScript中常用的修饰符及其功能：

1. 全局匹配(g)

全局匹配修饰符g允许正则表达式在整个输入字符串中查找所有匹配项，而不仅仅是找到第一个匹配项后就停止。这对于需要在大型文本中进行多次匹配的任务特别有用。例如：

let str = "Hello, hello, HELLO!";
let pattern = /hello/gi;
console.log(str.match(pattern)); // 输出: ["Hello", "hello", "HELLO"]

在这个例子中，g修饰符使得正则表达式能够在整个字符串中查找所有"hello"的实例，无论它们出现在何处。

1. 忽略大小写(i)

忽略大小写修饰符i使正则表达式在匹配时不区分大小写。这对于需要进行不区分大小写的文本匹配时非常有用。例如：

let str = "Hello, hello, HELLO!";
let pattern = /hello/i;
console.log(str.match(pattern)); // 输出: ["Hello", "hello", "HELLO"]

在这个例子中，i修饰符使得"hello"能够匹配所有大小写变体。

1. 多行模式(m)

多行模式修饰符m改变了锚点^和$的行为，使它们能够匹配每一行的开头和结尾，而不仅仅是整个字符串的开头和结尾。这对于处理多行文本特别有用。例如：

let str = "Hello\nWorld\nGoodbye";
let pattern = /^World/m;
console.log(pattern.test(str)); // 输出: true

在这个例子中，m修饰符使得^World能够匹配第二行的开头。

1. 单行模式(s)

单行模式修饰符s使.元字符能够匹配包括换行符在内的任何字符。这在需要跨越多行进行匹配时特别有用。例如：

let str = "Hello\nWorld\nGoodbye";
let pattern = /Hello.W/gs;
console.log(pattern.test(str)); // 输出: true

在这个例子中，s修饰符使得.能够匹配换行符，从而使"Hello\nW"被视为连续的匹配。

1. Unicode模式(u)

Unicode模式修饰符u启用对Unicode的完全支持，使得正则表达式能够正确处理Unicode字符。这对于处理包含非ASCII字符的文本特别重要。例如：

let str = "你好，世界！";
let pattern = /\\p{L}+/gu;
console.log(str.match(pattern)); // 输出: ["你好", "世界"]

在这个例子中，u修饰符使得正则表达式能够正确识别和匹配Unicode字符。

1. 粘性匹配(y)

粘性匹配修饰符y使正则表达式从目标字符串的当前位置开始匹配，而不是从字符串的开头开始。这在需要从特定位置开始匹配时特别有用。例如：

let str = "Hello, hello, HELLO!";
let pattern = /hello/y;
pattern.lastIndex = 7;
console.log(pattern.test(str)); // 输出: true

在这个例子中，通过设置lastIndex属性，y修饰符使得正则表达式从字符串的第八个字符开始匹配。

这些修饰符可以单独使用，也可以组合使用，以实现更复杂的正则表达式匹配行为。通过合理使用这些修饰符，开发者可以构建出更加灵活和精确的正则表达式，从而满足各种复杂的文本处理需求。

实战应用

表单验证

在实战应用中，正则表达式是表单验证的利器。以下展示如何使用正则表达式验证常见数据格式：

1. 电子邮件验证 ：

const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

1. 密码强度验证 ：

const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{8,}$/;

1. 电话号码验证 ：

const phoneRegex = /^\d{3}-\d{3}-\d{4}$/;

这些正则表达式分别用于验证电子邮件格式、确保密码包含大小写字母和数字以及匹配标准的电话号码格式。通过合理使用这些表达式，可以有效提升表单提交的质量和用户体验。

文本处理

正则表达式在文本处理中发挥着重要作用，尤其在字符串替换、提取和分割方面表现突出。以下展示三个典型应用场景：

1. 字符串替换 ：

let text = "Hello world! Hello JavaScript!";
let newText = text.replace(/Hello/g, "Hi");
console.log(newText); // 输出: Hi world! Hi JavaScript!

1. 字符串提取 ：

let str = "a/b|c/d|e/f";
let arr = str.split(/[\/|]/);
console.log(arr); // 输出: ['a', 'b', 'c', 'd', 'e', 'f']

1. 复杂文本处理 ：

let textWithNumbers = "Item 1, Item 2, Item 3";
let newTextWithIncrement = textWithNumbers.replace(/(Item) (\\d+)/g, "$1 $2+");
console.log(newTextWithIncrement); // 输出: Item 1+, Item 2+, Item 3+

这些示例展示了正则表达式在文本处理中的多样性和灵活性，能够满足各种复杂的文本处理需求。