JavaScript RegExp cant use twice? [duplicate]

Question

I have a very strage problem:

var cat = [ { slug: "test/foo", id: 1}, { slug: "test/bar", id: 1}];
var searchreg = new RegExp("test","g");

cat.forEach(function(item){
  if(searchreg.test(item.slug)){
    console.log(item);
  } 
});

This should print me both items out of "cat". But I only get the first. If I add more items I only get every 2nd (start with the first).

I get it woking with:

var cat = [ { slug: "test/foo", id: 1}, { slug: "test/bar", id: 1}];

cat.forEach(function(item){
  var searchreg = new RegExp("test","g");
  if(searchreg.test(item.slug)){
    console.log(item);
  } 
});

But I don't understand why this don't work (Chrome) - anyone a Idea?

Answer 1

It's because of the g ("global") flag. RegExp instances have state when you use the g flag: They remember where the last match they saw was, so they can continue from that point (for instance, if you're using them in a loop). (Yes, this is not the best design it could have had.) So the first time, it finds test in the string (and notes that it's not at the end of the string); the second time, it tries to find test continuing in the previous string from the previous location, and of course doesn't find it. The third time, since it knows it ran out of input last time, it looks at the input again.

In your case, since you don't need to search further than the first instance, simply remove the g flag:

var searchreg = /test/; // That's a regex literal, basically: ... = new RegEx("test")

Alternately, you could reset it by assigning 0 to its lastIndex property:

searchreg.lastIndex = 0;
if (searchreg.test(item.slug))

Or, in this specific use case, you don't need regex at all:

if (item.slug.indexOf("test") !== -1) {
    // It has "test" in the slug
}