Javascript正则表达式意外输出

Question

我正在尝试使用node在css文件上做一些正则表达式 。

这是我的javascript：

var fs = require ('fs');

fs.readFile('test.css','utf8',function(error,css){
if(error){
    console.log("I'm sorry, something went terribly wrong :o Here's the message: "+error);
}



var matches = css.match(/([a-zA-Z-]+):\s*([0-9]+)(vh|VH|vw|VW)/g);

    console.log(matches[2][1]);



});

运行时的预期输出：

实际产量：

正如您所看到的，它并没有像预期的那样将每个匹配放在它自己的数组中，它只是将所有内容放在一个没有任何子数组的巨型数组中。 我能做什么？

Answer 1

在这种情况下， match不会为您提供详细的匹配结果：

如果正则表达式包含g标志，则该方法返回包含所有匹配的子字符串而不是匹配对象的Array。

您可以使用exec代替：

var regex = /([a-zA-Z-]+):\s*([0-9]+)(vh|VH|vw|VW)/g;
var css = "body{\nfont-size: 10vw;\n height: 500vh\n}";
var match;

while (match = r.exec(css)){
    console.log(match)
}

这给出了这个输出：

["font-size: 10vw", "font-size", "10", "vw", index: 6, input: "body{↵font-size: 10vw;↵ height: 500vh↵}"]  
["height: 500vh", "height", "500", "vh", index: 24, input: "body{↵font-size: 10vw;↵ height: 500vh↵}"]

Answer 2

var reg = /([a-zA-Z-]+):\s*([0-9]+)(vh|VH|vw|VW)/g;
var matches = [];
var m;

while ((m = reg.exec(css)) !== null) {
    if (m.index === reg.lastIndex) {
        reg.lastIndex++;
    }
    matches.push(m);
}

console.log(matches);

Answer 3

这实际上是预期的行为。 如果将string.match方法与全局标志一起使用，则括号不会在匹配内创建组：

var str = "javascript is cool";
var result = str.match( /JAVA(SCRIPT)/g );
console.log( result[0] ); // javascript
console.log( result.length ); //1

你的情况是使用regexp.exec(str) 。 它可以找到所有匹配和括号组。

var str = 'javascript is cool. Use javascript';

var regexp = /java(script)/g;

while (result = regexp.exec(str)) {   
  console.log(result.length);   //2
  console.log(result[0]);  //javascript
  console.log(result[1]);  //script 
} 

Answer 4

基于以上答案，我设法得到以下代码：

while(match = css.match(/([a-zA-Z-]+):\s*([0-9]+)(vh|VH|vw|VW)/)){
        matches.push(match);
        css = css.replace(match[0],'');
}

非常感谢大家的帮助！