正则表达式?:和?=的区别

正则表达式是一个强大的匹配工具，它可以帮助开发人员快速精准地找到指定的文本。在正则表达式中，?:和?=是两个常见的特殊符号，它们有什么区别呢？在本文中，我们将一一探讨。

什么是正则表达式?

正则表达式是一种用于匹配字符串的方法，它可以匹配文本中的特定内容。在正则表达式中，有一些特殊符号和语法，可以用于定义匹配规则。

在JavaScript中，我们可以使用RegExp对象来创建一个正则表达式。例如，我们可以使用正则表达式来匹配字符串中的数字：

const reg = /\d+/g;
const str = "abc123def456";
console.log(str.match(reg)); // ["123", "456"]

在上面的代码中，我们定义了一个正则表达式\d+，它可以匹配一个或多个数字。我们使用RegExp对象将这个正则表达式转化为一个可执行的实例reg，然后使用String对象的match方法将字符串str中的数字提取出来并返回一个数组。

?:的用法

在正则表达式中，?:表示非捕获组，它的作用是匹配一个字符但不保留该字符。即在匹配时忽略这个分组的存在，不会将这个分组的字符加入到结果中，并且也不会给这个分组分配一个组编号。

例如，我们要匹配一个字符串中的手机号码，但只需要匹配到第4位数字，不需要保留前面的3位数字。我们可以用(?:)来表示非捕获组：

const reg = /(?:\d{3})(\d{4})(\d{4})/;
const str = "13812345678";
console.log(str.match(reg)); // ["1234", "5678"]

在上面的代码中，我们定义了一个正则表达式，它表示匹配一个以3个数字开头的手机号码，但只保留号码的后8位数字。我们使用了(?:\d{3})表示一个非捕获组，它匹配了前3个数字，但不会保留到结果中。

?=的用法

在正则表达式中，?=表示正向预查，它的作用是匹配一个字符串后面紧跟着指定字符的字符串，并且只返回匹配的字符，不返回预查字符。

例如，我们要匹配一个字符串中以数字结尾的单词，但不需要匹配到数字，我们可以使用正向预查：

const reg = /[a-zA-Z]+\d(?=\b)/g;
const str = "hello1 world2";
console.log(str.match(reg)); // ["hello", "world"]

在上面的代码中，我们定义了一个正则表达式[a-zA-Z]+\d(?=\b)，它表示匹配字母开头，数字结尾的单词，并且这个单词是一个完整的单词（即后面没有其他字符）。我们使用了(?=\b)表示正向预查，它匹配单词结束的位置，但不会返回这个位置的字符。

?:和?=的对比

在上面的两个例子中，我们使用了?:和?=两个符号来处理不同的问题。它们的主要差别在于：?:不保留匹配内容，而?=保留匹配内容。

因此，在处理需要保留匹配内容的情况时，我们应该使用正向预查；在处理不需要保留匹配内容的情况时，我们应该使用非捕获组。考虑到正向预查还是比较常用的，我们再来看一个更实际的例子。

例如，我们要匹配一个email地址，但只需要匹配出@之前的用户名部分，可以使用正向预查来解决这个问题：

const reg = /(\w+)(?=@)/;
const str = "hello@163.com";
console.log(str.match(reg)); // ["hello", "hello"]

在上面的代码中，我们定义了一个正则表达式(\w+)(?=@)，它表示匹配一个email地址中的用户名部分，并且这个部分必须在@符号之前。我们使用了(?=@)表示正向预查，它匹配@符号之前的位置，但不会返回@符号。同时，我们使用了捕获组(\w+)来保留用户名部分的内容，并返回这个内容的值。