Replacing text in strings is a common task in JavaScript. In this article, you’ll look at using replace
and regular expressions to replace text.
Normally JavaScript’s String replace()
function only replaces the first instance it finds in a string:
const myMessage = 'this is the sentence to end all sentences';
const newMessage = myMessage.replace('sentence', 'message');
console.log(newMessage); // this is the message to end all sentences
In this example, only the first instance of sentence
was replaced.
If you want JavaScript to replace all instances, you’ll have to use a regular expression using the /g
operator:
const myMessage = 'this is the sentence to end all sentences';
const newMessage = myMessage.replace(/sentence/g, 'message');
console.log(newMessage); // this is the message to end all messages
This time both instances are changed.
In addition to using the inline /g
, you can use the constructor function of the RegExp
object:
const myMessage = 'this is the sentence to end all sentences';
const newMessage = myMessage.replace(new RegExp('sentence', 'g'), 'message');
console.log(newMessage); // this is the message to end all messages
To replace special characters like -/\^$*+?.()|[]{})
, we’ll need to use a backslash to escape them.
Here’s an example. Given the string this\-is\-my\-url
, let’s replace all the escaped dashes (\-
) with an unescaped dash (-
).
You can do this with replace()
:
const myUrl = 'this\-is\-my\-url';
const newUrl = myMessage.replace(/\\-/g, '-');
console.log(newUrl); // this-is-my-url
Alternatively, use new Regexp()
:
const myUrl = 'this\-is\-my\-url';
const newUrl = myUrl.replace(new RegExp('\-', 'g'), '-');
console.log(newUrl); // this-is-my-url
In this second example, you don’t have to use a backslash to escape the backslash.
In this article, you saw how to replace single instances, multiple instances, and how to handle strings with special characters.
Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!
Sign up for Infrastructure as a Newsletter.
Working on improving health and education, reducing inequality, and spurring economic growth? We'd like to help.
Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.
Since ES2021, you could also use
String.prototype.replaceAll()
.