String replace JavaScript bad design

After using JavaScript for a while one of the worst parts I found was the String.replace function. When I realized it's behaviour I thought to myself someone is going to use this wrong. The function itself is excellent, I use it all the time as you could probably tell with my code. It is far better than some other languages with the ability to use strings/regexes and provide a function callback for the replacement.

But...it's default behaviour is designed badly. When using replace most developers assume it works in global mode and the characters you intend to replace will all be replaced. Consider the following pitfall:-

<code lang="javascript"> alert(':::'.replace(':',''));//only one : is replaced! </code>

What do you expect? No colons? You are not alone. Unfortunately by default replace assumes you only want to replace one character. Don't ask me why.

To counteract this Mozilla decided to add a third argument! This is even worse! It makes is even more confusing. Now we have a function that accepts three arguments, first a string/regex, second a string/function and third a flag for the string replacement. We then have a situation where the replacement is global on Firefox and not on every other browser and to top it off, if you use the third flag with a regexp then the regexp won't of course be global thus adding yet more confusion!

<code lang="javascript"> alert(':::'.replace(':','','g'));//replaces all ":" on Firefox but not on other browsers alert(':::'.replace(/:/,'','g'));//replaces one ":" as the flag only works for strings. </code>

A huge mess I'm sure you'll agree, IMO the replace function should work globally by default for string arguments with the option to match only once if for some crazy reason it is needed.

The correct way of doing a global replacement is to use regexes because strings don't even allow you to do a global replacement on all browsers!

<code lang="javascript"> alert(':::'.replace(/:/g,''));//The correct way </code>

Finally here is a patch that you can use to prevent your developers making the same mistakes a certain social network made.

<pre lang="javascript"> String.prototype.replace = (function(r){ return function(find, replace, replaceOnce) { if(typeof find == 'string' && !replaceOnce) { find = r.apply(find, [/[\[\]^$*+.?(){}\\\-]/g,function(c) { return '\\'+c; }]); find = new RegExp(find, 'g'); } else if(typeof find == 'object' && !replaceOnce && !find.global) { find = new RegExp(find.source, 'g'); } return r.apply(this, [find,replace]); } })(String.prototype.replace); alert('aaaabbbbb'.replace(/a/,'')) </pre>