我希望找到$ctrl.之后的属性和我过go 执行此操作的正则表达式:/\$ctrl\.(\w+)(?:\.\w+)?/g.

此正则表达式不够好,因为对于此输入:

const str =
  '$ctrl.bla $ctrl.bar.foo $ctrl.bla{{index}}.foo $ctrl.1bla $ctrl.invalid.prop{{index}}';

它符合以下条件:

$ctrl.bla      <--- good.
$ctrl.bar.foo. <-- not good. should find the `bar` because it's the word after $ctrl.
$ctrl.bla      <--- goood
$ctrl.1bla.    <-- invalid property syntax because it has number.
$ctrl.invalid.prop  <-- should match the invalid word not matter that prop end with {{.

如何更改正则表达式以匹配有效的属性语法?

const regex = /\$ctrl\.(\w+)(?:\.\w+)?/g;
const str =
  '$ctrl.bla $ctrl.bar.foo $ctrl.bla{{index}}.foo $ctrl.1bla $ctrl.invalid.prop{{index}}';
let match;

while ((match = regex.exec(str)) != null) {
  console.log(match[0]);
}

stackblitz.com

推荐答案

正如之前在 comments 中发布的那样,您可以使用正则表达式只匹配字母(a-zA-Z表示只区分正确的大小写),并使用超前/后视来只匹配您需要的内容.

我的解决方案是:

const regex = /(?<=\$ctrl\.)[a-zA-Z]+(?=\s|\.|$)/g

console.log('$ctrl.bla $ctrl.bar.foo $ctrl.bla{{index}}.foo $ctrl.1bla $ctrl.invalid.prop{{index}}'.match(regex))
// Output: ['bla', 'bar', 'invalid']

Regex解释说:

  • (?<=\$ctrl\.):这是一个正向回溯,因为我只需要匹配$ctrl后面的属性,而不需要实际匹配它
  • [a-zA-Z]+:仅匹配从az的不区分大小写的字母(+将至少匹配其中的一个)
  • (?=\s|\.|$):这是一个积极的前瞻,我用它来断言,如果我匹配一个props ,实际的字符串将在它之后以空格(\s)、点(\.)结束,或者因为字符串结束($)

通过使用后视和前视,我们确保只匹配我们需要的内容(在本例中只匹配props 名称)

Javascript相关问答推荐

如何在coCos2d-x中更正此错误

在Java中寻找三次Bezier曲线上的点及其Angular

第二次更新文本输入字段后,Reaction崩溃

在Reaction中的handleSubmit按钮内,useSelector值仍然为空

使用auth.js保护API路由的Next.JS,FETCH()不起作用

VSCode中出现随机行

删除加载页面时不存在的元素(JavaScript)

处理app.param()中的多个参数

为什么我不能使用其同级元素调用和更新子元素?

如何在每隔2分钟刷新OKTA令牌后停止页面刷新

Firefox的绝对定位没有达到预期效果

如何用react组件替换dom元素?

观察子组件中的@Output事件emits 器?

元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件),但GET:Object.在Reaction项目中

如何在Flat Pickr中更改取消选中日期的 colored颜色

查找函数句柄的模块/文件

JSdiscord机器人为什么不工作前缀?如何决定与discord机器人的问题?

使用jQuery将表中的数据插入到文本区域

对两个不同值的数组进行排序,并保持平面数组 struct

如何在Java脚本中 Select 该元素?-Chrome扩展