Javascript regex match and get values from string

Question

I've got a string of text which can have specific tags in it. Example: var string = '<pause 4>This is a line of text.</pause><pause 7>This is the next part of the text.</pause>';

What I'm trying to do is do a regex match against the <pause #></pause> tag. For each tags found, in this case it's <pause 4></pause> and <pause 7></pause>. What I want is to grab the value 4 and 7, and the string length divided by for the string in between the <pause #>...</pause> tags.

What I have for now is not much. But I cant figure out how to grab all the cases, then loop through each one and grab the values I'm looking for.

My function for this looks like this for now, it's not much:

/**
* checkTags(string)
* Just check for tags, and add them
* to the proper arrays for drawing later on
* @return string
*/
function checkTags(string) {

    // Regular expresions we will use
    var regex = {
        pause: /<pause (.*?)>(.*?)<\/pause>/g
    }

    var matchedPauses = string.match(regex.pause);

    // For each match
      // Grab the pause seconds <pause SECONDS>
      // Grab the length of the string divided by 2 "string.length/2" between the <pause></pause> tags
      // Push the values to "pauses" [seconds, string.length/2]

    // Remove the tags from the original string variable

    return string;


}

If anyone can explain my how I could do this I would be very thankful! :)

Answer 1

match(/.../g) doesn't save subgroups, you're going to need exec or replace to do that. Here's an example of a replace-based helper function to get all matches:

function matchAll(re, str) {
  var matches = [];
  str.replace(re, function() {
    matches.push([...arguments]);
  });
  return matches;
}

var string = '<pause 4>This is a line of text.</pause><pause 7>This is the next part of the text.</pause>';

var re = /<pause (\d+)>(.+?)<\/pause>/g;

console.log(matchAll(re, string))

Since you're removing tags anyways, you can also use replace directly.