学习正则，学习过程中发现这 6 个方便的正则表达式

 几乎所有流行的编程语言都支持正则表达式，因为正则实在是太强大了，它能让我们原本需要数十行代码才能完成的，正则大哥一行就能搞定了。

创新互联公司服务项目包括饶平网站建设、饶平网站制作、饶平网页制作以及饶平网络营销策划等。多年来，我们专注于互联网行业，利用自身积累的技术优势、行业经验、深度合作伙伴关系等，向广大中小型企业、政府机构等提供互联网行业的解决方案，饶平网站推广取得了明显的社会效益与经济效益。目前，我们服务的客户以成都为中心已经辐射到饶平省份的部分城市，未来相信会继续扩大服务区域并继续获得客户的支持与信任！

在本文中，我们将研究前端开发人员经常必须处理的6个文本处理和操作，并了解正则表达式是如何简化这个过程的。

查找包含特定单词的句子

假设我们想要匹配文本中包含特定单词的所有句子。因为需要在搜索结果中显示这些句子，或者想从文本中删除它们。正则表达式/[^.!?]*\bword\b[^.!?]*.?/gi可以帮我们做到这一点。如下所示：

 
 
 
 
  
  
  
  
const str = "The apple tree originated in Central Asia. It is cultivated worldwide. Apple matures in late summer or autumn." 
  
  
  
  
 
  
  
  
  
// 查找包含单词“ apple”的句子 
  
  
  
  
str.match(/[^.!?]*\bapple\b[^.!?]*.?/gi) 
  
  
  
  
 
  
  
  
  
// 输出结果 
  
  
  
  
// => ["The apple tree originated in Central Asia.", "Apple matures in late summer or autumn."] 
 
 
 

接着，我们来看此正则表达式含义：

• [^.!?] 表示匹配任务字符，除了 ., !和?
• *匹配[^.!?]结果的 0 次或者多次
• \b 匹配单词的边界
• apple 就是匹配apple(因为它区分大小写，我们在正则表达式的末尾添加i标志)
• \b 匹配单词的边界
• [^.!?] 表示匹配任务字符，除了 ., !和?
• *匹配[^.!?]结果的 0 次或者多次
• .匹配任何字符，除了换行
• ?匹配.所匹配到的结果的 0 次或者 1 次
• g 告诉正则表达式引擎匹配所有匹配项，而不是在第一次匹配后停止
• i 使搜索不区分大小写

从文件名中去除无效字符

下载的文件时，其名称中不应包含某些字符。例如，在 Windows 中，以下字符在文件名中无效，应将其删除：

• <
• >
• :
• “
• /
• \
• |
• ?
• *

使用正则表达式，去除无效字符非常简单。让我们看一个例子

 
 
 
 
  
  
  
  
const str = "https://en.wikipedia.org/" 
  
  
  
  
 
  
  
  
  
str.replace(/[<>|:"*?\\/]+/g, '') 
  
  
  
  
// => "httpsen.wikipedia.org" 
 
 
 

[] 称为字符类，JS 会把字符串与方括号之间的字符之一匹配，在配合全局(g)标志，我们可以有效地从字符串中去除方括号内的字符。

注意，在字符类中，反斜杠有特殊含义，必须用另一个反斜杠进行转义:\\。+操作符表示重复字符类，以便同时替换一系列无效字符，这有利于提高性能。当然可以省略，对结果也没有影响。

请记住，除非希望将无效字符替换为另一个字符，否则replace()方法的第二个参数必须为空字符串。

Windows 内部还使用了几个保留名称来执行各种任务，并且这些保留名称不允许用作文件名，保留名称如下：

CON, PRN, AUX, NUL, COM1, COM2, COM3, COM4, COM5, COM6, COM7, COM8, COM9, LPT1, LPT2, LPT3, LPT4, LPT5, LPT6, LPT7, LPT8, 和 LPT9

如果您想了解更多信息，Microsoft的Windows开发中心提供了有关有效文件名的详尽文章。

要排除保留名称，可以使用以下代码：

 
 
 
 
  
  
  
  
str.replace(/^(CON|PRN|AUX|NUL|COM1|COM2|COM3|COM4|COM5|COM6|COM7|COM8|COM9|LPT1|LPT2|LPT3|LPT4|LPT5|LPT6|LPT7|LPT8|LPT9)$/i, 'file') 
 
 
 

上面代码主要是将保留字替换成指定的字符。

请注意，如果字符串包含非保留字其他字符，则不会替换。例如，会把“con”替换掉，但不会替换“concord”，所以 这是有效的文件名。

其中 ,^匹配字符串的开头。它确保没有其他字符出现在我们要匹配的字符串之前，$则匹配字符串的结尾。

我们还可以通过使用字符类以更简单方式来简化该正则：

 
 
 
 
  
  
  
  
str.replace(/^(CON|PRN|AUX|NUL|COM[1-9]|LPT[1-9])$/i, 'file') 
 
 
 

[1–9]匹配 1 到 9 之间的数字。

用单个空格替换多个空格

当网页渲染时，重复的空格字符被显示为单个空格。但是，有时我们希望用户输入或其他数据中包含的多个空格，我们只想用用单个空格来表示。使用正则表达式可以很简单的做到这点：

 
 
 
 
  
  
  
  
const str = "  My    opinions may  have changed,    but not the fact that I'm right." 
  
  
  
  
 
  
  
  
  
str.replace(/\s\s+/g, ' ') 
  
  
  
  
// => " My opinions may have changed, but not the fact that I'm right." 
 
 
 

此正则表达式仅包含两个元字符，一个运算符和一个标志位：

• \s匹配单个空格字符，包括ASCII空格，制表符，换行符，回车符，垂直制表符和换页符
• \s 再次匹配一个空格字符
• +与上一项匹配一次或多次，也就是匹配一个或多个空格
• g 告诉正则表达式引擎匹配所有匹配项，而不是在第一次匹配后停止

上面的结果是替换了至少重复两次的所有空白字符。请注意，上面示例中的结果在开始时仍具有空白字符，应将其删除。为此，只需将trim()函数添加到语句的末尾：

 
 
 
 
  
  
  
  
str.replace(/\s\s+/g, ' ').trim() 
  
  
  
  
 
  
  
  
  
// => "My opinions may have changed, but not the fact that I'm right." 
 
 
 

请记住，此代码用空格(U + 0020)字符替换任何类型的空格字符，包括ASCII空格，制表符，换行符，回车符，垂直制表符和换页符。因此，如果回车符紧跟在制表符之后，它们将被空格替换。如果这不是我们的意图，并且只想替换相同类型的空格，请改用以下代码：

 
 
 
 
  
  
  
  
str.replace(/(\s)\1+/g, '$1').trim(); 
 
 
 

\1是一个反向引用，与在第一对括号(\s)中匹配的相同字符匹配。要替换它们，我们在replace()的第二个参数中使用$1，该参数将在括号中插入匹配的字符。

限制用户只能输入数字或字母

Web开发过程中的一项常见表单操作就是限制用户输入。比如，我们想将用户限制为数字或者字母。同样，使用正则，很简单就能做到：使用字符类定义允许的字符范围，然后在其后附加一个量词以指定可以重复的字符数：

 
 
 
 
  
  
  
  
const input1 = "John543"; 
  
  
  
  
const input2 = ":-)"; 
  
  
  
  
/^[A-Z0-9]+$/i.test(input1);    // → true 
  
  
  
  
/^[A-Z0-9]+$/i.test(input2);    // → false 
 
 
 

运作方式如下：

• ^匹配字符串的开头，它确保没有其他字符出现在我们要匹配的字符串之前。
• [A-Z0–9]匹配介于A和Z之间或介于0和9之间的字符。由于这是区分大小写的，因此我们将i标志，表示忽略大小写。或者，我们也可以使用 [A-Za-z0–9]来代替。
• + 匹配一次或多次。因此，输入必须至少包含一个非空白的字母数字字符;否则，匹配失败。如果要使该字段为可选字段，则可以使用*量词，该量词与前面的项匹配零次或多次。
• $匹配字符串的结尾。

将网址变成链接

假设我们在文本中有一个或多个不是 HTML 锚元素的网址，因此无法点击。我们希望将 URL 自动转换为链接。为此，我们首先需要找到 URL，然后将每个 URL 包裹在…标记中，并使用的href属性指向该URL：

 
 
 
 
  
  
  
  
const str = "Visit https://en.wikipedia.org/ for more info."; 
  
  
  
  
str.replace(/\b(https?|ftp|file):\/\/\S+[\/\w]/g, '$&') 
  
  
  
  
 
  
  
  
  
// => "Visit https://en.wikipedia.org/ for more info." 
 
 
 

来看看这段代码是如何工作的：

• \b匹配单词边界的位置
• (https?|ftp|file) 匹配字符https，http，ftp或file。
• : 从字面上匹配冒号
• \/ 从字面上匹配正斜杠字符
• \S 匹配任何非空格的单个字符
• + 匹配上一项一次或多次
• [\/\w] 匹配正斜杠或单词字符。如果没有这个，则正则表达式将匹配URL末尾的所有标点符号
• g告诉正则表达式引擎匹配所有匹配项，而不是在第一次匹配后停止
• $& 在 replace() 的第二个参数中，将匹配的子字符串插入替换字符串中

删除重复的单词

有时，我们会发现有的文章单词重复了，如果通过遍历来去重，就很麻烦。幸运的是，正则仅用一行代码就能解决此问题：

 
 
 
 
  
  
  
  
const str = "This this sentence has has double words." 
  
  
  
  
 
  
  
  
  
str.replace(/\b(\w+)\s+\1\b/gi, '$1') 
  
  
  
  
 
  
  
  
  
// => "This sentence has double words." 
 
 
 

• \b 匹配单词的边界
• \w 匹配单词字符
• + 匹配上一项的一次或多次
• \1 是一个反向引用，它表示在第一对括号中所匹配的文本
• \b 匹配单词边界
• g 告诉正则表达式引擎匹配所有匹配项，而不是在第一次匹配后停止
• i 忽略大小写
• $1表示分组的第一个文本内容

总结

正则表达式已成为任何程序员必备的技能之一。在本文中，我们研究了前端开发人员如何利用正则表达式执行各种任务。但是，我们只是挖掘了正则表达式一些基础面。

多花点时间来学习正则，我觉得这是很值得的，有时候我们遇到到很复杂的规则时，当你的有同事正在绞尽脑汁写着上百行的代码，你只用一句正则就能搞定，我相信，你的同事将对你刮目相看。加油!!!

作者：Faraz Kelhini 译者：前端小智 来源：medium

原文：https://code.tutsplus.com/tutorials/8-regular-expressions-you-should-know--net-6149

本文转载自微信公众号「 大迁世界」，可以通过以下二维码关注。转载本文请联系 大迁世界公众号。

新闻名称：学习正则，学习过程中发现这 6 个方便的正则表达式
网页网址：http://www.shufengxianlan.com/qtweb/news11/394761.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联