在 Javascript 中返回正则表达式 match() 的位置？

Question

有没有办法检索 Javascript 中正则表达式 match() 结果字符串内的（起始）字符位置？

Answer 1

var str = 'my string here';

var index = str.match(/hre/).index;

alert(index); // <- 10

Answer 2

exec 返回一个带有 index 属性的对象：

var match = /bar/.exec("foobar");
if (match) {
    console.log("match found at " + match.index);
}

对于多个匹配：

var re = /bar/g,
    str = "foobarfoobar";
while ((match = re.exec(str)) != null) {
    console.log("match found at " + match.index);
}

Answer 3

这是我想出的：

// Finds starting and ending positions of quoted text
// in double or single quotes with escape char support like \" \'
var str = "this is a \"quoted\" string as you can 'read'";

var patt = /'((?:\\.|[^'])*)'|"((?:\\.|[^"])*)"/igm;

while (match = patt.exec(str)) {
  console.log(match.index + ' ' + patt.lastIndex);
}

Answer 4

在现代浏览器中，您可以使用 字符串来完成此操作。 matchAll()。

与 RegExp.exec() 相比，这种方法的好处是它不依赖于有状态的正则表达式，如 @Gumbo 的回答。

let regexp = /bar/g;
let str = 'foobarfoobar';

let matches = [...str.matchAll(regexp)];
matches.forEach((match) => {
    console.log("match found at " + match.index);
});

Answer 5

来自 developer.mozilla.org 文档在 String .match() 方法上：

返回的数组有一个额外的输入属性，其中包含
已解析的原始字符串。此外，它还有一个索引
属性，表示匹配项的从零开始的索引
字符串。

处理非全局正则表达式（即正则表达式上没有 g 标志）时，.match() 返回的值有一个 index 财产...您所要做的就是访问它。

var index = str.match(/regex/).index;

这是一个显示它也有效的示例：

var str = 'my string here';

var index = str.match(/here/).index;

console.log(index); // <- 10

我已经成功地测试了这一点，一直到 IE5。

Answer 6

您可以使用 String 对象的 search 方法。这仅适用于第一场比赛，但否则会执行您所描述的操作。例如：

"How are you?".search(/are/);
// 4

Answer 7

这是我最近发现的一个很酷的功能，我在控制台上尝试了这个，它似乎有效：

var text = "border-bottom-left-radius";

var newText = text.replace(/-/g,function(match, index){
    return " " + index + " ";
});

返回：“border 6 Bottom 13 left 18 radius”

所以这似乎就是您正在寻找的。

Answer 8

如果您的正则表达式匹配宽度 0，恐怕之前的答案（基于 exec）似乎不起作用。例如（注意：/\b/g是应该找到所有单词边界的正则表达式）：

var re = /\b/g,
    str = "hello world";
var guard = 10;
while ((match = re.exec(str)) != null) {
    console.log("match found at " + match.index);
    if (guard-- < 0) {
      console.error("Infinite loop detected")
      break;
    }
}

人们可以尝试通过让正则表达式匹配至少 1 个字符来解决此问题，但这远非理想（并且意味着您必须在字符串末尾手动添加索引）

var re = /\b./g,
    str = "hello world";
var guard = 10;
while ((match = re.exec(str)) != null) {
    console.log("match found at " + match.index);
    if (guard-- < 0) {
      console.error("Infinite loop detected")
      break;
    }
}

更好的解决方案（仅适用于较新的浏览器/需要旧/IE版本的polyfills）是使用 String.prototype.matchAll()

var re = /\b/g,
    str = "hello world";
console.log(Array.from(str.matchAll(re)).map(match => match.index))

说明：

String.prototype.matchAll() 需要一个全局正则表达式（设置了全局标志的 g ）。然后它返回一个迭代器。为了循环和 map() 迭代器，必须将其转换为数组（这正是 Array.from() 所做的）。与 RegExp.prototype.exec() 的结果一样，根据规范，结果元素具有 .index 字段。

请参阅 String.prototype.matchAll()< /a> 和 Array.from() 浏览器支持和填充选项的 MDN 页面。

---

编辑：深入挖掘所有浏览器支持的解决方案

RegExp.prototype.exec() 的问题是它更新了 lastIndex 指针指向正则表达式，下次从之前找到的 lastIndex 开始搜索。

var re = /l/g,
str = "hello world";
console.log(re.lastIndex)
re.exec(str)
console.log(re.lastIndex)
re.exec(str)
console.log(re.lastIndex)
re.exec(str)
console.log(re.lastIndex)

只要正则表达式匹配实际上有宽度，这种方法就很有效。如果使用 0 宽度的正则表达式，该指针不会增加，因此您会得到无限循环（注意：/(?=l)/g 是 l 的前瞻——它匹配 0- l 之前的宽度字符串，因此它在第一次调用 exec() 时正确地转到索引 2，然后停留在那里：

var re = /(?=l)/g,
str = "hello world";
console.log(re.lastIndex)
re.exec(str)
console.log(re.lastIndex)
re.exec(str)
console.log(re.lastIndex)
re.exec(str)
console.log(re.lastIndex)

因此，解决方案（不如 matchAll() 好，但应该适用于所有浏览器）是如果匹配宽度为 0（可以通过不同方式检查），则手动增加 lastIndex

var re = /\b/g,
    str = "hello world";
while ((match = re.exec(str)) != null) {
    console.log("match found at " + match.index);

    // alternative: if (match.index == re.lastIndex) {
    if (match[0].length == 0) {
      // we need to increase lastIndex -- this location was already matched,
      // we don't want to match it again (and get into an infinite loop)
      re.lastIndex++
    }
}

Answer 9

我很幸运地使用了基于 matchAll 的单行解决方案（我的用例需要一个字符串位置数组）

let regexp = /bar/g;
let str = 'foobarfoobar';

let matchIndices = Array.from(str.matchAll(regexp)).map(x => x.index);

console.log(matchIndices)

输出：[3, 9]

Answer 10

该成员 fn 返回 String 对象内输入单词的从 0 开始的位置（如果有）的数组。

String.prototype.matching_positions = function( _word, _case_sensitive, _whole_words, _multiline )
{
   /*besides '_word' param, others are flags (0|1)*/
   var _match_pattern = "g"+(_case_sensitive?"i":"")+(_multiline?"m":"") ;
   var _bound = _whole_words ? "\\b" : "" ;
   var _re = new RegExp( _bound+_word+_bound, _match_pattern );
   var _pos = [], _chunk, _index = 0 ;

   while( true )
   {
      _chunk = _re.exec( this ) ;
      if ( _chunk == null ) break ;
      _pos.push( _chunk['index'] ) ;
      _re.lastIndex = _chunk['index']+1 ;
   }

   return _pos ;
}

现在尝试

var _sentence = "What do doers want ? What do doers need ?" ;
var _word = "do" ;
console.log( _sentence.matching_positions( _word, 1, 0, 0 ) );
console.log( _sentence.matching_positions( _word, 1, 1, 0 ) );

您还可以输入正则表达式：

var _second = "z^2+2z-1" ;
console.log( _second.matching_positions( "[0-9]\z+", 0, 0, 0 ) );

这里获取线性项的位置索引。

Answer 11

var str = "The rain in SPAIN stays mainly in the plain";

function searchIndex(str, searchValue, isCaseSensitive) {
  var modifiers = isCaseSensitive ? 'gi' : 'g';
  var regExpValue = new RegExp(searchValue, modifiers);
  var matches = [];
  var startIndex = 0;
  var arr = str.match(regExpValue);

  [].forEach.call(arr, function(element) {
    startIndex = str.indexOf(element, startIndex);
    matches.push(startIndex++);
  });

  return matches;
}

console.log(searchIndex(str, 'ain', true));

Answer 12

function trimRegex(str, regex){
    return str.substr(str.match(regex).index).split('').reverse().join('').substr(str.match(regex).index).split('').reverse().join('');
}

let test = '||ab||cd||';
trimRegex(test, /[^|]/);
console.log(test); //output: ab||cd

或者

function trimChar(str, trim, req){
    let regex = new RegExp('[^'+trim+']');
    return str.substr(str.match(regex).index).split('').reverse().join('').substr(str.match(regex).index).split('').reverse().join('');
}

let test = '||ab||cd||';
trimChar(test, '|');
console.log(test); //output: ab||cd