Today, I had the need to do a String.Replace in JavaScript. I thought, “surely, this is an easily solved problem”. It turns out that I was both right and wrong.<\/p>\n
A quick DuckDuckGo search brought back that I could do something like this:<\/p>\n
\r\nvar input = \"I hate Fridays. Fridays are the worst!\";\r\nvar output = input.replace(\"Fridays\", \"Mondays\");\r\n<\/pre>\nI would expect the value of output to be “I hate Mondays. Mondays are the worst!”. But it isn’t. Instead, the value is “I hate Mondays. Fridays are the worst!”, because the replace method will only replace the first instance of the match.<\/p>\n
The first solution that I found to this was to modify the code to use a regular expression, which the replace method also takes. All you have to do is include the RegEx and the “g” flag to make the replacement global. That would make the code look like this:<\/p>\n
\r\nvar input = \"I hate Fridays. Fridays are the worst!\";\r\nvar output = input.replace(\/Fridays\/g, \"Mondays\");\r\n<\/pre>\nThis does give us the correct output of “I hate Mondays. Mondays are the worst!”, but if this were to be a reusable method or a pattern throughout an application, getting the correct RegEx can be tricky to debug or come back to later. Not everyone is a RegExpert. That’s why the next solution that I found was ingenious and was the one that I ended up going with.<\/p>\n
In this code, you split the string on your “outgoing” string, and join it back together again with your “incoming” string. That would look like this:<\/p>\n
\r\nvar input = \"I hate Fridays. Fridays are the worst!\";\r\nvar output = input.split(\"Fridays\").join(\"Mondays\");\r\n<\/pre>\n