如何在 string.prototype.matchAll 的 RegEx 中使用组合捕获组？

Question

我尝试使用以下 RegEx 在我的 textInput（字符串）中捕获一些模式：

let idPatterns = /\[id="(.*?)\"]|\[id="(.*?)"]|\[id="(.*?)"]/gim;

对我来说重要的部分是包含的“id”：(.*?)

为了提取 ID，我使用了以下内容：

patternsArray = [...textInput.matchAll(idPatterns)];

我对以下文本的结果是：

text [id="B0076VLVXG"] text

数组：

0: "undefined"

但是当我将 idPatterns 变量减少到

let idPatterns = /\[asin="(.*?)"]/gim;

我得到 "B0076VLVXG" 作为结果（根据需要）。所以总而言之，我的 idPatterns 的串联似乎不准确，但可以单独使用它们中的每一个。如何正确组合 RegEx 中的三组模式？谢谢你的帮助。

function getIdsCombinedRegEx(textInput) {
 
  const idPatterns = /\[id="(.*?)\"]|\[id="(.*?)"]|\[id="(.*?)"]/gim;

  const idPatternsCollection = [...textInput.matchAll(idPatterns)];

  return idPatternsCollection;
}

function getIdsSingleRegEx(textInput) {
 
  const idPatterns = /\[id="(.*?)"]/gim;

  const idPatternsCollection = [...textInput.matchAll(idPatterns)];

  return idPatternsCollection;
}

let textInput = '[id="B07Q45WX5D"] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. [id="B08CQTNK8S"]';

console.log(getIdsCombinedRegEx(textInput));

console.log(getIdsSingleRegEx(textInput));

Answer 1

您的正则表达式应该按原样工作，return匹配第 2 组中的匹配项（因为它被交替的第二个分支中的组捕获：

const idPatterns = /\[id="(.*?)\"]|\[id="(.*?)"]|\[id="(.*?)"]/gim;

const textInput = 'text [id="B0076VLVXG"] text'; 

const patternsArray = [...textInput.matchAll(idPatterns)];

console.log(patternsArray);

由于每次交替都会 return 匹配不同的组，将正则表达式重写为常量捕获组可能更容易。例如：

\[id(?:=|=)("|"|")(.*?)]

这寻找：

• 字符[id
• = 或 =
• "、" 或 " 之一（在组 1 中捕获）
• 最小字符数（在第 2 组中捕获）
• 与第 1 组中捕获的内容匹配（引用部分）
• 收盘]

regex101

上的正则表达式演示

对于您的扩展数据：

const textInput = '[id="B07Q45WX5D"] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. [id="B08CQTNK8S"]';

const idPatterns = /\[id(?:=|=)("|"|")(.*?)]/gim;

const idPatternsCollection = [...textInput.matchAll(idPatterns)];

// just get group 2
const idValues = idPatternsCollection.map(m => m[2]);

console.log(idValues);