详解可以用在VS Code中的正则表达式小技巧


Posted in Javascript onMay 14, 2019

你是不是一直都想学正则表达式,但是因为它的复杂性而被推迟了?在本文中,我将向你展示五个易于学习的正则技巧,你可以立即在自己喜欢的文本编辑器中使用它们。

详解可以用在VS Code中的正则表达式小技巧

文本编辑器设置

虽然现在几乎所有的文本编辑器都支持正则表达式,但我在本教程中用的是 Visual Studio Code,不过你可以使用任何你喜欢的编辑器。另请注意,你通常需要在搜索输入框附近的某处打开 RegEx 开关。以下是在 VS Code 中执行此操作的方法:

详解可以用在VS Code中的正则表达式小技巧

你需要通过选中此选项启用RegEx

1) .  —  匹配任何字符

让我们开始吧。点符号 . 用来匹配任何字符:

b.t

详解可以用在VS Code中的正则表达式小技巧

上面的正则匹配 "bot"`"bat"和任何以b开头、t结尾的三个字符的单词。但是如果你想搜索点符号,则需要用 \ 来对它进行转义,所以下面这个正则只匹配确切的文本 "b.t"

b\.t

详解可以用在VS Code中的正则表达式小技巧

2) .*  —  匹配任何东西

这里 . 表示“任何字符”* 表示“此符号重复前面那个内容任何次数。” 把它们放在一起(.*)表示“任何符号重复任意次数。” 例如,你可以用它来查找以某些文本开头或结尾的匹配项。假设我们有一个这样的 javascript 方法

loadScript(scriptName: string, pathToFile: string)

我们想找到这个方法的所有调用,其中 pathToFile 指向文件夹“lua” 中的任何文件。可以使用以下正则表达式:

loadScript.*lua

这意味着,“匹配所有以 "loadScript" 开始同时以"lua"结束的字符串。”

详解可以用在VS Code中的正则表达式小技巧

3) ?  —  非贪婪的匹配

.* 之后的 ? 符号和其他一些匹配规则意味着“尽可能少的匹配”。 在上一张图中,每次匹配都会得到两次 "lua"字符串,直到第二个 "lua" 所有东西才能全部匹配完毕。如果你想匹配第一次出现的"lua",可以使用以下正则:

loadScript.*?lua

这意味着,“匹配所有以 "loadScript"开头,后面为任意字符,直到第一次出现"lua"

详解可以用在VS Code中的正则表达式小技巧

loadScript.*?lua:匹配以 loadScript 开头的所有内容,直到第一次出现"lua"

4) `( ) ###  — 捕获组和反向引用

好的,现在我们可以匹配一些文字了。但是如果想要修改我们发现的部分文本呢?这时候就要用到捕获组。

假设我们修改了 loadScript 方法,现在需要在它原来的两个参数之间插入另外一个参数。让我们把这个新参数命名为 id,这时新的函数原型应如下所示:loadScript(scriptName,id,pathToFile)。我们在这里不能用文本编辑器的常规替换功能,不过正则表达式能够帮助我们。

详解可以用在VS Code中的正则表达式小技巧

通过上图你可以看到运行以下正则表达式的结果:

loadScript\(.*?,.*?\)

这意味着:“匹配以 "loadScript(" 开头的, 后面跟任意内容,直到遇到第一个, ,然后是任意内容,直到第一个)

对你来说,可能看唯一起来比较奇怪的是 \ 符号。它们用于对括号进行转义。

因为符号 () 是正则表达式用来捕获匹配文本部分的特殊字符,但我们需要匹配实际的括号字符,所以需要对它们进行转义。

在前面的表达式中,我们使用.*?符号定义了方法调用的两个参数。要使每个参数作为单独的捕获组,需要在它们的前后分别添加()符号:

loadScript\((.*?),(.*?)\)

如果你运行这段正则,你将看到没有任何变化。这是因为它匹配的是相同的文本。但现在我们可以将第一个参数称为\$1,将第二个参数称为\$2。这称为反向引用,它将帮助我们做自己想要的事情:在两个参数中间添加另一个参数:

搜索输入:

loadScript\((.*?),(.*?)\)

这与之前的正则相同,但分别将参数映射到倒了捕获组1和2。

替换输入:

loadScript($1,id,$2)

这意味着“用文本"loadScript("、捕获组1、"id"、捕获组2和 ) 替换每个匹配的文本 ”。请注意,你不需要在替换输入中转义括号。

详解可以用在VS Code中的正则表达式小技巧

5) [ ]  —  字符类

你可以在 [ ] 符号内来列出要在特定位置匹配的字符。例如,[0-9]匹配从0到9的所有数字。你还可以明确列出所有数字:[0123456789] —— 与前面的含义相同。你也可以使用带字母的破折号,[a-z] 将匹配所有小写拉丁字符,[A-Z] 将匹配所有大写拉丁字符,[a-zA-Z] 将会匹配两者。

你也可以在字符类之后使用 *,就像在 . 之后一样,在这种情况下意味着:“匹配此类中任意数量的字符”

详解可以用在VS Code中的正则表达式小技巧

后记

你应该知道有几种正则表达式的写法。我在这里讨论的是 javascript RegEx 引擎。大多数现代引擎都很相似,但也可能会存在一些差异。通常这些差异包括转义字符和反向引用标记。

你现在就可以打开文本编辑器,立即开始使用其中的一些技巧。你将看到可以比以前更快地完成许多重构任务。一旦你掌握了这些技巧,就可以开始研究更多的正则表达式了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Flash+XML滚动新闻代码 无图片 附源码下载
Nov 22 Javascript
javascript高级学习笔记整理
Aug 14 Javascript
cookie在javascript中的使用技巧以及隐私在服务器端的设置
Dec 03 Javascript
JS实现图片预加载无需等待
Dec 21 Javascript
运算符&&的三个不同层次
Apr 07 Javascript
AngularJS基础 ng-disabled 指令详解及简单示例
Aug 01 Javascript
jquery属性,遍历,HTML操作方法详解
Sep 17 Javascript
深入理解Vue生命周期、手动挂载及挂载子组件
Sep 27 Javascript
微信小程序实现image组件图片自适应宽度比例显示的方法
Jan 16 Javascript
Vue实现todolist删除功能
Jun 26 Javascript
vue+Vue Router多级侧导航切换路由(页面)的实现代码
Dec 20 Javascript
Node.js设置定时任务之node-schedule模块的使用详解
Apr 28 Javascript
vue项目中引入vue-datepicker插件的详解
May 14 #Javascript
JQuery获取可视区尺寸和文档尺寸及制作悬浮菜单示例
May 14 #jQuery
JavaScript中this的全面解析及常见实例
May 14 #Javascript
jquery 验证用户名是否重复代码实例
May 14 #jQuery
记录vue项目中遇到的一点小问题
May 14 #Javascript
javascript中如何判断类型汇总
May 14 #Javascript
详解如何探测小程序返回到webview页面
May 14 #Javascript
You might like
PHP 身份验证方面的函数
2009/10/11 PHP
php中关于codeigniter的xmlrpc的类在进行数据交换时的类型问题
2011/07/03 PHP
thinkphp视图模型查询提示ERR: 1146:Table 'db.pr_order_view' doesn't exist的解决方法
2014/10/30 PHP
php将日期格式转换成xx天前的格式
2015/04/16 PHP
Laravel框架控制器的middleware中间件用法分析
2019/09/30 PHP
ASP.NET jQuery 实例11 通过使用jQuery validation插件简单实现用户登录页面验证功能
2012/02/03 Javascript
jQuery阻止事件冒泡具体实现
2013/10/11 Javascript
用原生JS获取CLASS对象(很简单实用)
2014/10/15 Javascript
javascript简单实现滑动菜单效果的方法
2015/07/27 Javascript
jquery插件jquery.confirm弹出确认消息
2015/12/22 Javascript
JS平滑无缝滚动效果的实现代码
2016/05/06 Javascript
JavaScript必知必会(九)function 说起 闭包问题
2016/06/08 Javascript
在vue项目中引入highcharts图表的方法(详解)
2018/03/05 Javascript
Vue项目实现简单的权限控制管理功能
2019/07/17 Javascript
javascript实现页面的实时时钟显示示例
2020/08/06 Javascript
Vue 组件注册全解析
2020/12/17 Vue.js
Python入门篇之对象类型
2014/10/17 Python
python获取指定网页上所有超链接的方法
2015/04/04 Python
Python中的高级函数map/reduce使用实例
2015/04/13 Python
python下os模块强大的重命名方法renames详解
2017/03/07 Python
Python即时网络爬虫项目启动说明详解
2018/02/23 Python
利用Python复制文件的9种方法总结
2019/09/02 Python
浅谈Python __init__.py的作用
2020/10/28 Python
实例讲解使用CSS实现多边框和透明边框的方法
2015/09/08 HTML / CSS
Ellos丹麦:时尚和服装在线
2016/09/19 全球购物
Vans英国官方网站:美国南加州的原创极限运动潮牌
2017/01/20 全球购物
美国南部最大的家族百货公司:Belk
2017/01/30 全球购物
应届生新闻编辑求职信
2013/11/19 职场文书
外企财务年会演讲稿
2014/01/03 职场文书
社区党员先进事迹
2014/01/22 职场文书
安全责任书怎么写
2014/07/28 职场文书
领导班子四风对照检查材料
2014/09/23 职场文书
交通事故委托书范本精选
2014/10/04 职场文书
销售业务员岗位职责
2015/02/13 职场文书
病房管理制度范本
2015/08/06 职场文书
编写python程序的90条建议
2021/04/14 Python