Javascript正则表达式正在对文字括号进行分组？

Question

const str = `zell class="www-some" bro and class="ded_Me" or addClass('coolman') also addClass("boo-boo")`;

const allCssClassRegex = /addClass\(["|']([a-zA-Z0-9-_]+)["|']\)|class=["|']([a-zA-Z0-9-_]+)["|']/gi;
let match;

while ((match = allCssClassRegex.exec(str)) != null) {
    console.log(match);
}

我正在尝试匹配两个模式并让数组的第二个成员成为匹配项。输出如下:

[ 'class="www-some"',
  undefined,
  'www-some',
  index: 5,
  input: 'zell class="www-some" bro and class="ded_Me" or addClass(\'coolman\') also addClass("boo-boo")' ]
[ 'class="ded_Me"',
  undefined,
  'ded_Me',
  index: 30,
  input: 'zell class="www-some" bro and class="ded_Me" or addClass(\'coolman\') also addClass("boo-boo")' ]
[ 'addClass(\'coolman\')',
  'coolman',
  undefined,
  index: 48,
  input: 'zell class="www-some" bro and class="ded_Me" or addClass(\'coolman\') also addClass("boo-boo")' ]
[ 'addClass("boo-boo")',
  'boo-boo',
  undefined,
  index: 73,
  input: 'zell class="www-some" bro and class="ded_Me" or addClass(\'coolman\') also addClass("boo-boo")' ]

看起来文字 ( 它以某种方式被解释为一个组，因为它的第二个成员 match 是未定义的(并且 1, 2 个插槽是匹配的)。

如何修复此正则表达式以使第二个数组槽仅匹配？

Answer 1

您的模式存在一些问题，可能可以稍微精简一下:

/(?:addClass[(]*|class=)["']([a-zA-Z0-9_-]+)["'][)]*/gi;

也在字符类中 [9-_] 暗示 9 到 _，您可能不这样做不想。如果您重新排列字符，使其类似于 [9_-](其中“-”)位于末尾，那么它将起作用。