在Javascript中返回正则表达式匹配（）的位置？

Question

有没有办法在Javascript中检索正则表达式匹配（）结果字符串中的（起始）字符位置？

Answer 1

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 2

以下是我提出的建议：

// 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 3

来自字符串.match()方法的developer.mozilla.org文档：

  

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

在处理非全局正则表达式（即正则表达式中没有g标志）时，.match()返回的值具有index属性...所有你需要的是访问它。

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

以下示例显示了它的工作原理：

＆＃13;

＆＃13;

var str = 'my string here';

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

alert(index); // <- 10

＆＃13;

＆＃13;

＆＃13;

我已成功测试了这一回到IE5。

Answer 4

在现代浏览器中，您可以使用string.matchAll()完成此操作。

与RegExp.exec()相比，这种方法的好处是它不像@Gumbo's answer那样依赖于正则表达式为有状态的。

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

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

Answer 5

您可以使用search对象的String方法。这仅适用于第一场比赛，否则将按照您的描述进行。例如：

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

Answer 6

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

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

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

返回：＆＃34; border 6 bottom 13 left 18 radius＆＃34;

所以这似乎就是你要找的东西。

Answer 7

此成员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 8

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 9

恐怕前面的答案（基于 exec）在您的正则表达式匹配宽度 0 的情况下似乎不起作用。例如（注意：/\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 版本上使用 polyfill）是使用 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 字段。

有关浏览器支持和 polyfill 选项的信息，请参阅 String.prototype.matchAll() 和 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 的前瞻——它匹配 l 之前的 0 宽度字符串。所以它在第一次调用 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 10

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

Answer 11

var str = 'my string here';

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

alert(index); // <- 10