Question

I seem to be getting a consistently strange outcome when testing my regex in javascript.

Here’s my fiddle:
http://jsfiddle.net/s5fYf/15/

This is taken from a web project I’m building. I pass an array of validation objects into my validation function which iterates through them, validating each rule against the value. If one is false it should stop the loop and return a return object which picks up a message and cssClass from the failed rule.

The problem is the validation method seems to return false even if the regex test passes, which should be impossible! So I feel like I’m missing something key. From the debug output you can see that the regex test that is output passes, but then obviously fails when it is tested in the code. This is inline with what I see in my project where if I omit the debug output the return value basically toggles between true and false.

Essentially the /regex/.test(value) function seems to oscillate between true and false which is consistent but not what I was expecting… So, my question is what is causing this bizarre behaviour!?

I have tested my regex outside of the solution and as far as I can see it works.

UPDATE:

Omitting the ‘g’ or global flag from my regex solved this issue.

See the answer below and then this link for a full explanation of the global flag and its pitfalls:

Why RegExp with global flag in Javascript give wrong results?

Answer 1

It boils down to the fact that the test method of javascript regular expressions returns a result and moves a pointer on to after the match.

So the first call returns true, then the second returns false. Check this example: http://jsfiddle.net/B9aVA/

var regex = /^.+$/g
var input = "Hello";
console.log(regex.test(input));
console.log(regex.test(input));

Writes

true
false

So your code which calls test twice:

case "regex":
    $(".debug-info").append('<span>Result: ' + validation[i].rule.test(value) + '</span><br />');
     if (!validation[i].rule.test(value))
          returnValue.isValid = false;
     break;

My suggestion is to call test once and store the result in a variable, and use that instead

case "regex":
    var result = validation[i].rule.test(value);
    $(".debug-info").append('<span>Result: ' + result + '</span><br />');
     if (!result)
          returnValue.isValid = false;
     break;

Moral of the story: Methods can have side effects, that’s what distinguishes them from properties.