JavaScript正则表达式初学者指南

每个使用JavaScript的人都必须同时处理字符串。 有时，您只需要在另一个变量中存储一个字符串，然后将其传递即可。 其他时候，您将不得不检查它并查看它是否包含特定的子字符串。

但是，事情并不总是那么容易。 有时，您将不查找特定的子字符串而是寻找遵循某种模式的一组子字符串。

假设您必须将字符串中所有出现的“ Apples”替换为“ apples”。 您可以简单地使用theMainString.replace("Apples", "apples") 。 好，易于。

现在，假设您还必须将“ appLes”替换为“ apples”。 同样，“ appLES”也应成为“苹果”。 基本上，所有“ Apple”的大小写变体都需要更改为“ apple”。 在这种情况下，将简单的字符串作为参数传递将不再实用或有效。

这就是使用正则表达式的地方-您可以简单地使用不区分大小写的标志i并对其进行处理。 有了标志，原始字符串是否包含“ Apples”，“ APPles”，“ ApPlEs”或“ Apples”都没有关系。 这个单词的每个实例都将被替换为“苹果”。

就像不区分大小写的标志一样，正则表达式提供了许多其他功能，这些功能将在本教程中介绍。

在JavaScript中使用正则表达式

您必须使用稍微不同的语法来表示不同String方法中的正则表达式。 与简单的字符串（用引号引起来）不同，正则表达式由包含在斜杠之间的模式组成。 您在正则表达式中使用的所有标志都将附加在第二个斜杠之后。

回到前面的示例，这是带有正则表达式和简单字符串的replace()方法的外观。

"I ate Apples".replace("Apples", "apples");
// I ate apples

"I ate Apples".replace(/Apples/i, "apples");
// I ate apples

"I ate aPPles".replace("Apples", "apples");
// I ate aPPles

"I ate aPPles".replace(/Apples/i, "apples");
// I ate apples

如您所见，正则表达式在两种情况下均有效。 现在，我们将详细了解组成正则表达式中的模式的标志和特殊字符。

正则表达式中的反斜杠

您可以通过在普通字符之前添加反斜杠来将其转换为特殊字符。 同样，可以通过在特殊字符之前添加反斜杠来将其转换为普通字符。

例如， d不是特殊字符。 但是， \d用于匹配字符串中的数字字符。 同样， D也不是特殊字符，但是\D用于匹配字符串中的非数字字符。

数字字符包括0、1、2、3、4、5、6、7、8和9。当在正则表达式中使用\d ，它将匹配这9个字符中的任何一个。 在正则表达式中使用\D ，它将匹配所有非数字字符。

下面的示例应该使事情变得清楚。

"L8".replace(/\d/i, "E");
// LE

"L8".replace(/\D/i, "E");
// E8

"LLLLL8".replace(/\D/i, "E");
// ELLLL8

您应注意，在第三种情况下仅替换第一个匹配的字符。 您还可以使用标志替换所有匹配项。 稍后我们将了解这些标志。

就像\d和\D ，还有其他特殊字符序列。

1. 您可以使用\w匹配字符串中的任何“单词”字符。 在此，文字字符是指AZ，az，0-9和_。 因此，基本上，它将匹配所有数字，所有小写和大写字母以及下划线。
2. 您可以使用\W匹配字符串中的任何非单词字符。 它将匹配％，$，＃，₹等字符。
3. 您可以使用\s匹配单个空格字符，包括空格，制表符，换页符和换行符。 同样，您可以使用\S匹配空格以外的所有其他字符。
4. 您还可以使用\f ， \n ， \r ， \t和\v查找特定的空白字符，它们代表换页，换行，回车，水平制表符和垂直制表符。

有时，您会遇到需要用替换词替换单词的情况，但前提是您不必 大词的一部分。 例如，考虑以下句子：

“很多菠萝图像发布在应用程序上”。

在这种情况下，我们希望将“ app”一词替换为“ board”。 但是，使用简单的正则表达式模式会将“ apple”变成“ boardle”，最后一句话将变为：

“很多pineboardle图片发布在应用程序上”。

在这种情况下，您可以使用另一个特殊字符序列： \b 。 这将检查单词边界。 单词边界是通过使用任何非单词字符（例如空格，“ $”，“％”，“＃”等）形成的。但是请注意，它也包含带有重音符号的字符，例如“ü”。

"A lot of pineapple images were posted on the app".replace(/app/, "board");
// A lot of pineboardle images were posted on the app

"A lot of pineapple images were posted on the app".replace(/\bapp/, "board");
// A lot of pineapple images were posted on the board

同样，您可以使用 \B匹配非单词边界。 例如，您可以使用\B仅在“ app”位于另一个单词（例如“菠萝”）中时进行匹配。

匹配模式“ n”次

您可以使用^告诉JavaScript仅查看匹配项的字符串开头。 同样，您可以使用$只查看字符串的结尾以进行匹配。

您可以使用* 匹配前面的表达式0次或更多次。 例如， /Ap*/将匹配A ， Ap ， App ， Appp等。

以类似的方式，您可以使用+匹配前面的表达式1次或更多次。 例如， /Ap+/将匹配Ap ， App ， Appp等。 这次表达式将不匹配单个A。

有时，您只想匹配给定模式的特定出现次数。 在这种情况下，应使用{n}字符序列，其中n是数字。 例如， /Ap{2}/将匹配App而不匹配Ap 。 它还将与Appp中的前两个'p'匹配，并且保持第三个不变。

您可以使用{n,}匹配给定表达式中至少出现'n'个匹配项。 这意味着/Ap{2,}/将匹配App而不匹配Ap 。 它还将匹配Apppp中的所有“ p”，并用替换字符串替换它们。

您也可以使用{n,m}来指定最小和最大数目，并限制给定表达式应匹配的次数。 例如， /Ap{2,4}/将匹配App ， Appp和Apppp 。 它还将与Apppppp中的前四个'p'匹配，其余的保持不变。

"Apppppples".replace(/Ap*/, "App");
// Apples

"Ales".replace(/Ap*/, "App");
// Apples

"Appppples".replace(/Ap{2}/, "Add");
// Addppples

"Appppples".replace(/Ap{2,}/, "Add");
// Addles

"Appppples".replace(/Ap{2,4}/, "Add");
// Addples

使用括号记住匹配项

到目前为止，我们仅用常量字符串替换了模式。 例如，在上一节中，我们使用的替换始终是“添加”。 有时，您将不得不在给定的字符串中查找模式匹配项，然后将其替换为模式的一部分。

假设您必须在一个字符串中找到一个包含五个或更多字母的单词，然后在该单词的末尾添加一个“ s”。 在这种情况下，由于最终值取决于匹配模式本身，因此您将无法使用常量字符串值来代替。

"I like Apple".replace(/(\w{5,})/, '$1s');
// I like Apples

"I like Banana".replace(/(\w{5,})/, '$1s');
// I like Bananas

这是一个简单的示例，但是您可以使用相同的技术在内存中保留多个匹配模式。 完全匹配中的子模式数将由使用的括号数决定。

在替换字符串中，第一个子匹配项将使用$1标识，第二个子匹配项将使用$2标识，依此类推。 这是另一个示例，以进一步阐明括号的用法。

"I am looking for John and Jason".replace(/(\w+)\sand\s(\w+)/, '$2 and $1');
// I am looking for Jason and John

在正则表达式中使用标志

正如我在引言中提到的那样，正则表达式的另一个重要功能是使用特殊标志来修改执行搜索的方式。 这些标志是可选的，但您可以使用它们来进行全局搜索或不区分大小写的搜索。

这是四个常用标志，用于更改JavaScript搜索或替换字符串的方式。

• g ：此标志将执行全局搜索，而不是在第一个匹配项后停止。
• i ：该标志将执行搜索，而不会检查确切的大小写匹配。 例如，在不区分大小写的搜索中，Apple，aPPLe和apPLE都被视为相同。
• m ：此标志将执行多行搜索。
• y ：此标志将在lastIndex属性指示的索引中查找匹配项。

以下是与标志一起使用的一些正则表达式示例：

"I ate apples, you ate apples".replace(/apples/, "mangoes");
// "I ate mangoes, you ate apples"

"I ate apples, you ate apples".replace(/apples/g, "mangoes");
// "I ate mangoes, you ate mangoes"

"I ate apples, you ate APPLES".replace(/apples/, "mangoes");
// "I ate mangoes, you ate APPLES"

"I ate apples, you ate APPLES".replace(/apples/gi, "mangoes");
// "I ate mangoes, you ate mangoes"


var stickyRegex = /apples/y;
stickyRegex.lastIndex = 3;
"I ate apples, you ate apples".replace(stickyRegex, "mangoes");
// "I ate apples, you ate apples"

var stickyRegex = /apples/y;
stickyRegex.lastIndex = 6;
"I ate apples, you ate apples".replace(stickyRegex, "mangoes");
// "I ate mangoes, you ate apples"

var stickyRegex = /apples/y;
stickyRegex.lastIndex = 8;
"I ate apples, you ate apples".replace(stickyRegex, "mangoes");
// "I ate apples, you ate apples"

最后的想法

本教程的目的是向您介绍JavaScript中的正则表达式及其重要性。 我们从基础开始，然后介绍了反斜杠和其他特殊字符。 我们还学习了如何检查字符串中的重复模式，以及如何记住模式中的部分匹配项以便以后使用。

最后，我们了解了使正则表达式更加强大的常用标志。 您可以在这篇有关MDN的文章中了解有关正则表达式的更多信息。

如果您希望我在本教程中进行说明，请随时在评论中让我知道。

翻译自: https://code.tutsplus.com/tutorials/a-beginners-guide-to-regular-expressions-in-javascript--cms-31130