Replacing the nth instance of a regex match in Javascript

Question

I'm trying to write a regex function that will identify and replace a single instance of a match within a string without affecting the other instances. For example, I have this string:

12||34||56 

I want to replace the second set of pipes with ampersands to get this string:

12||34&&56 

The regex function needs to be able to handle x amount of pipes and allow me to replace the nth set of pipes, so I could use the same function to make these replacements:

23||45||45||56||67 -> 23&&45||45||56||67  23||34||98||87 -> 23||34||98&&87 

I know that I could just split/replace/concat the string at the pipes, and I also know that I can match on /\|\|/ and iterate through the resulting array, but I'm interested to know if it's possible to write a single expression that can do this. Note that this would be for Javascript, so it's possible to generate a regex at runtime using eval(), but it's not possible to use any Perl-specific regex instructions.

Answer 1

A more general-purpose function

I came across this question and, although the title is very general, the accepted answer handles only the question's specific use case.

I needed a more general-purpose solution, so I wrote one and thought I'd share it here.

Usage

This function requires that you pass it the following arguments:

• original: the string you're searching in
• pattern: either a string to search for, or a RegExp with a capture group. Without a capture group, it will throw an error. This is because the function calls split on the original string, and only if the supplied RegExp contains a capture group will the resulting array contain the matches.
• n: the ordinal occurrence to find; eg, if you want the 2nd match, pass in 2
• replace: Either a string to replace the match with, or a function which will take in the match and return a replacement string.

Examples

// Pipe examples like the OP's replaceNthMatch("12||34||56", /(\|\|)/, 2, '&&') // "12||34&&56" replaceNthMatch("23||45||45||56||67", /(\|\|)/, 1, '&&') // "23&&45||45||56||67"  // Replace groups of digits replaceNthMatch("foo-1-bar-23-stuff-45", /(\d+)/, 3, 'NEW') // "foo-1-bar-23-stuff-NEW"  // Search value can be a string replaceNthMatch("foo-stuff-foo-stuff-foo", "foo", 2, 'bar') // "foo-stuff-bar-stuff-foo"  // No change if there is no match for the search replaceNthMatch("hello-world", "goodbye", 2, "adios") // "hello-world"  // No change if there is no Nth match for the search replaceNthMatch("foo-1-bar-23-stuff-45", /(\d+)/, 6, 'NEW') // "foo-1-bar-23-stuff-45"  // Passing in a function to make the replacement replaceNthMatch("foo-1-bar-23-stuff-45", /(\d+)/, 2, function(val){   //increment the given value   return parseInt(val, 10) + 1; }); // "foo-1-bar-24-stuff-45" 

The Code

  var replaceNthMatch = function (original, pattern, n, replace) {     var parts, tempParts;      if (pattern.constructor === RegExp) {        // If there's no match, bail       if (original.search(pattern) === -1) {         return original;       }        // Every other item should be a matched capture group;       // between will be non-matching portions of the substring       parts = original.split(pattern);        // If there was a capture group, index 1 will be       // an item that matches the RegExp       if (parts[1].search(pattern) !== 0) {         throw {name: "ArgumentError", message: "RegExp must have a capture group"};       }     } else if (pattern.constructor === String) {       parts = original.split(pattern);       // Need every other item to be the matched string       tempParts = [];        for (var i=0; i < parts.length; i++) {         tempParts.push(parts[i]);          // Insert between, but don't tack one onto the end         if (i < parts.length - 1) {           tempParts.push(pattern);         }       }       parts = tempParts;     }  else {       throw {name: "ArgumentError", message: "Must provide either a RegExp or String"};     }      // Parens are unnecessary, but explicit. :)     indexOfNthMatch = (n * 2) - 1;    if (parts[indexOfNthMatch] === undefined) {     // There IS no Nth match     return original;   }    if (typeof(replace) === "function") {     // Call it. After this, we don't need it anymore.     replace = replace(parts[indexOfNthMatch]);   }    // Update our parts array with the new value   parts[indexOfNthMatch] = replace;    // Put it back together and return   return parts.join('');    } 

An Alternate Way To Define It

The least appealing part of this function is that it takes 4 arguments. It could be simplified to need only 3 arguments by adding it as a method to the String prototype, like this:

String.prototype.replaceNthMatch = function(pattern, n, replace) {   // Same code as above, replacing "original" with "this" }; 

If you do that, you can call the method on any string, like this:

"foo-bar-foo".replaceNthMatch("foo", 2, "baz"); // "foo-bar-baz" 

Passing Tests

The following are the Jasmine tests that this function passes.

describe("replaceNthMatch", function() {    describe("when there is no match", function() {      it("should return the unmodified original string", function() {       var str = replaceNthMatch("hello-there", /(\d+)/, 3, 'NEW');       expect(str).toEqual("hello-there");     });    });    describe("when there is no Nth match", function() {      it("should return the unmodified original string", function() {       var str = replaceNthMatch("blah45stuff68hey", /(\d+)/, 3, 'NEW');       expect(str).toEqual("blah45stuff68hey");     });    });    describe("when the search argument is a RegExp", function() {      describe("when it has a capture group", function () {        it("should replace correctly when the match is in the middle", function(){         var str = replaceNthMatch("this_937_thing_38_has_21_numbers", /(\d+)/, 2, 'NEW');         expect(str).toEqual("this_937_thing_NEW_has_21_numbers");       });        it("should replace correctly when the match is at the beginning", function(){         var str = replaceNthMatch("123_this_937_thing_38_has_21_numbers", /(\d+)/, 2, 'NEW');         expect(str).toEqual("123_this_NEW_thing_38_has_21_numbers");       });      });      describe("when it has no capture group", function() {        it("should throw an error", function(){         expect(function(){           replaceNthMatch("one_1_two_2", /\d+/, 2, 'NEW');         }).toThrow('RegExp must have a capture group');       });      });     });    describe("when the search argument is a string", function() {      it("should should match and replace correctly", function(){       var str = replaceNthMatch("blah45stuff68hey", 'stuff', 1, 'NEW');       expect(str).toEqual("blah45NEW68hey");     });    });    describe("when the replacement argument is a function", function() {      it("should call it on the Nth match and replace with the return value", function(){        // Look for the second number surrounded by brackets       var str = replaceNthMatch("foo[1][2]", /(\[\d+\])/, 2, function(val) {          // Get the number without the [ and ]         var number = val.slice(1,-1);          // Add 1         number = parseInt(number,10) + 1;          // Re-format and return         return '[' + number + ']';       });       expect(str).toEqual("foo[1][3]");      });    });  }); 

May not work in IE7

This code may fail in IE7 because that browser incorrectly splits strings using a regex, as discussed here. [shakes fist at IE7]. I believe that this is the solution; if you need to support IE7, good luck. :)

Answer 2

here's something that works:

"23||45||45||56||67".replace(/^((?:[0-9]+\|\|){n})([0-9]+)\|\|/,"$1$2&&") 

where n is the one less than the nth pipe, (of course you don't need that first subexpression if n = 0)

And if you'd like a function to do this:

function pipe_replace(str,n) {    var RE = new RegExp("^((?:[0-9]+\\|\\|){" + (n-1) + "})([0-9]+)\|\|");    return str.replace(RE,"$1$2&&"); }