【es6】具名组匹配

1、组匹配

正则表达式使用圆括号进行组匹配,如:const RE_DATE = /(\d{4})-(\d{2})-(\d{2})/;,三个圆括号形成了三个组匹配。

代码:

javascript 复制代码
const RE_DATE = /(\d{4})-(\d{2})-(\d{2})/;

const matchObj = RE_DATE.exec('1999-12-31');
const year = matchObj[1]; // 1999
const month = matchObj[2]; // 12
const day = matchObj[3]; // 31

2、具名组匹配

ES2018 引入了具名组匹配(Named Capture Groups),允许为每一个组匹配指定一个名字,既便于阅读代码,又便于引用。

javascript 复制代码
const RE_DATE = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;

const matchObj = RE_DATE.exec('1999-12-31');
const year = matchObj.groups.year; // "1999"
const month = matchObj.groups.month; // "12"
const day = matchObj.groups.day; // "31"

上面代码中,"具名组匹配"在圆括号内部,模式的头部添加"问号 + 尖括号 + 组名"(?),然后就可以在exec方法返回结果的groups属性上引用该组名。同时,数字序号(matchObj1)依然有效。

相关推荐
lemon_sjdk31 分钟前
JavaScript 常用关键字全解析
开发语言·javascript·ecmascript
妖孽白小白40 分钟前
el-select的内容续写实现
前端·vue.js·elementui
不可能片场1 小时前
Electron 主进程热补丁:单行 JS 安全打法
前端·electron
梨想橙汁1 小时前
Pinia 状态管理实战:定义 Store、修改数据、模块拆分
前端·vue.js
高申航1 小时前
Vue 3 + DYMO Connect Framework 实战:从标签模板到打印服务的完整实现
前端·javascript·vue.js
梨想橙汁1 小时前
Vue3 组件开发:生命周期钩子,组件之间通信全方案
前端·vue.js
雪芽蓝域zzs1 小时前
分页组件 + el-config-provider 中文国际化 + 靠右布局
前端·javascript·vue.js
恋猫de小郭1 小时前
iPhone Duo 适配详解,需要改变的不止是布局模型
前端·flutter·ios
萧行之1 小时前
Observable Plot 源码深度解析——4 核心抽象逐项学习
前端·学习·数据可视化
今日无bug2 小时前
为什么大模型回答总是一个字一个字蹦出来?聊聊 SSE 流式输出与 BFF 层的那些事
前端·llm