JavaScript Regex Match Index

Question

I have the following little block of code to find an image source in a web page:

var reImg = [
  'src=\"(.*?)\" class=\"attachment-img-',
  'src=\"(.*?)\" class=\"image attachment-img-',
  'src=\"(.*?)-[0-9]+x[0-9]+(.*?)\" class=\"attachment-img-',
  'src=\"(.*?)\" class=\"full-size-gal'
];
var u = new RegExp(reImg.join('|'), 'i').exec(pageSource);
if (u) { 
  print(u);
}

I use an array to store the regexes because I may need to add more expressions later. Also, the double-quotes are escaped because the code above will be stored in a JSON file.

Now, the variable u has the results in it, but I need to get the value of u[1] or u[3] or u[5] - basically the stuff within the parenthesis. The problem is that I don't know which one matched. How do I get just the source URL?

Long story short, you can't, not like that. Javascript regex does not have a way to return that sort of thing. Other languages can sorta accomplish this with capture groups because they are capable of returning multi-dim arrays that break down what was matched by each captured group. JS doesn't do this, so basically you need to instead loop through reImg and exec them individually and return/break at first match — CrayonViolent
– CrayonViolent, Commented Dec 13, 2014 at 2:37
fyi it might be a slight performance increase to keep doing what you are doing now, but then match u against each eleme of reImg after the initial match (what you are doing now) so that you don't have to walk through all of pageSource for each regex — CrayonViolent
– CrayonViolent, Commented Dec 13, 2014 at 2:40
By the way, you don't need to escape the double quotes. When and if you stringify this object, that will be done for you. — user663031
– user663031, Commented Dec 13, 2014 at 4:10
@CrayonViolent: You can do a global match and go through each match's capturing group in JavaScript with RegExp.exec. You are probably talking about String.match, but even String.match works if you only match once. — nhahtdh
– nhahtdh, Commented Dec 13, 2014 at 4:35
@torazaburo: It's complicated... This bit of code is for a plugin called DownThemAll and there actually ends up being multiple levels of escapes required. — Caynadian
– Caynadian, Commented Dec 13, 2014 at 12:26

Caynadian · Accepted Answer · 2014-12-15 15:52:57Z

1

While the solution from @PaulS does work, it required me to have an ever expanding if statement as more regexs are added to the list. Instead, I went with the suggestion by @CrayonViolent and used a for loop:

var reImg = [
  'src=\"(.*?)\" class=\"attachment-img-',
  'src=\"(.*?)\" class=\"image attachment-img-',
  'src=\"(.*?)-[0-9]+x[0-9]+(.*?)\" class=\"attachment-img-',
  'src=\"(.*?)\" class=\"full-size-gal'
];
for (var i=0;i<reImg.length;i++) {
  var u = new RegExp(reImg[i], 'i').exec(pageSource);
  if (u) { 
    print(u[1]);
    break;
  }
}

answered Dec 15, 2014 at 15:52

Caynadian

7992 gold badges15 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Paul S. · Accepted Answer · 2014-12-13 02:52:56Z

0

Just logical OR them with ||, the failed matches will be undefined, finish with || '' for an empty string match (the only possible falsy outcome in a match)

var re = /(a)|(b)|(c)/,
    m  = re.exec('foo_b_foo');
m;            // ["b", undefined, "b", undefined]
m[1] || m[2] || m[3]; // "b"

Remember that no match found will still be null so this should be inside an if block

var x;
if (u) { 
    x = u[1] || u[3] || u[5] || '';
    // these may not be all the possibilities from the example posted
    // i.e. you didn't mention `u[2]` ?
}

edited Dec 13, 2014 at 2:52

answered Dec 13, 2014 at 2:46

Paul S.

66.6k9 gold badges129 silver badges143 bronze badges

3 Comments

CrayonViolent Over a year ago

that's not going to work as you expect. that's not how js regex returns things.

Paul S. Over a year ago

@CrayonViolent Please comment with an example of how JavaScript's RegExp returns things different to how I've put in the comments of line 3 and 4 of my example? I ran this code in my console as I wrote it.

Caynadian Over a year ago

This would be less than ideal as it would require me to change the logic each time I add a new regex to the array.

Collectives™ on Stack Overflow

JavaScript Regex Match Index

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related