Software, Development, and WordPress

Local Variables with JavaScript’s Replace

Sometime ago, I was working on a piece of client-side code that needed to encode some data before invoking an Ajax request. Next, it needed to decode the response data.

While doing this, I experienced a nuance in JavaScript’s replace() function that required a little bit of effort in order for it to work with the degree of flexibility I needed.

My code was sending a variable-length query string of data to the server. The problem was that the ampersands were not being properly decoded on the server-side after the initial Ajax request.

I was storing the encoded representation of the ampersand in a local variable named _ampersand and had a function that accepted the full query string to be sent to the server, encode the data, perform some additional processing, and then return it.

Essentially, the function looked like this:

function encodedData(strInput) {
    // irrelevant code removed...
    return strInput.replace(/&/g, _ampersand);

This worked for sending the data across the wire, but decoding the response proved to be another challenge.

Because I was performing a global replacement of the ampersand token, I was using the ‘g’ operator to manage all occurrences but actually using the variable in the replace() function didn’t work as expected.

Originally, I was trying to do this:

// this does not work...
function restoreAmpersands(strInput) {
    return strInput.replace('/' + _ampersand + '/g', '&');

Trying to concatenate the /’s on the value stored in the _ampersand doesn’t work: replace() requires a regular expression to work its magic. Since JavaScript was casting the result of the concatenation as a string, it wasn’t working.

So, I first created a regular expression that included the _ampersand variable along with the global operator. Then I passed that particular regular expression into the replacement code:

var sRegExInput = new RegExp(_ampersand, 'g');
return strInput.replace(sRegExInput, '&');

And that took care of it. Easy enough.


  1. Justin Bangerter

    Thanks, this helped a lot. I can’t believe I didn’t see this sooner.

  2. Claudia

    Awesome, thanks!
    Works great also in IE and saves me looooots of performance… :)

  3. Kevin

    I’ve been struggling the past two days trying to find a very efficient method of doing a bunch of replaces in a large amount of text. I tried about half a dozen different ways but couldn’t get one to consistently work across all browsers. RegEx can take forever when you need to do a lot of them and on a large amount of text. In fact, for me, even using the code example you are giving above would consistently crash all three browsers (IE, Chrome, Safari) every single time.

    But finally I stumbled upon the perfect solution. Lightning fast, works in all browsers, and one line of code:

    return strSourceString.split(strTextToFind).join(strTextToReplace);

    • Tom

      Thanks for posting this – it’s awesome!

  4. Jon

    Brilliant, helped me out a lot, and on my first Google too. I was trying to replace with ” (nothing) but as you say, the replace function expects either a regular expression or a string, not both.


    • Tom

      Thanks Jon!

      • Jon

        Just noticed this problem when returning here. The name and email values are redisplayed in the field (by cookie I’m guessing, rather than my Firefox) but your field prompts do too. Just lettin you know:

  5. Michael

    I had the exact same issue…well using xml and not an ampersand issue, but this is great. Thank you very much.

    • Tom

      Sure thing, Michael. Glad it helped :).

Leave a Reply

© 2020 Tom McFarlin

Theme by Anders NorenUp ↑