Javascript gives us a great function called string.replace() to modify the strings as we want and this tutorial is all about that

What is the string.replace()

In a one-liner, It is the power of Javascript which helps us to modify strings with ease and without writing a good amount of code actually a line only LOL

Let’s see it’s the explanation it’s syntax and it’s the usage with great examples to give you a rock foundation grounding

string.replace() syntax

The syntax of string.replace() is quite easy and a one-liner to say

Let’s have a look at 2 different approaches

str.replace(x,y)

string.replace() takes 2 arguments

The first one here is x – Which represents a regular expression which you want to remove from the string

The second one is y – Which represents the string from which you want to replace the x

Maybe you can understand it better by the example down below

//Declaring a string //
let string = "This Tutorial is great"

//Calling string.replace() on the above declared string //
var right = string.replace(/great/,'awesome')

//Here /great/ is a regex to get the word great out of the string //

//Here awesome is the string to replace the regex pattern string //

console.log(right)

//OUTPUT//

//This Tutorial is awesome//

Now maybe you are getting my Point

Let’s look at one more approach to achieve the same

//Creating a variable regex to store the regex of what i want to remove //
var regex = /great/

//Creating a variable to store a string//
var string = `This Tutorial is great`

//Calling string.replace()//
string.replace(regex , `awesome`)

//OUTPUT //

//"This Tutorial is awesome"//

Now maybe you get it

The only difference between these 2 examples is that in this one i even created a variable to store the regex and then used it inside string.replace()

A Last example you mus need

Now Let’s try this example

//Delaring a string //
let string = "This great Tutorial is great"

//Calling string.replace() on the above declared string //
var right = string.replace(/great/,'awesome')

//Getting the Output//
console.log(right)

Now let’s guess the output and what not do a task just quickly run it in your js console and see what you get

I think that you will get something like this

This awesome Tutorial is great

Now you might think that what is this and some of you even spot that what’s wrong with it if not let me tell you that it only replaced first great not both of them

A Brief intro how things work under the hood

Actually the concept is quite simple the string.replace() works as i already stated that it takes the regular expression and a string to replace it with quite simple but after taking that it stops just when the things match up to means as it sees “Ok that there is the first great let’s replace it and my task is done”

But that is not what we want to get so to remove every occurrence of a particular phrase we just need to change our regex a little bit just need to add 1 letter more that’s it

Let me show you

var right = string.replace(/great/g,'awesome')

Yeah Just add a g more which will act as an option and will match all the occurrence of the phrase in the string

Now Let’s try that old example again

//Delaring a string //
let string = "This great Tutorial is great"

//Calling string.replace() on the above declared string //
var right = string.replace(/great/g,'awesome')

//Getting the Output//
console.log(right)

//OUTPUT//

//This awesome Tutorial is awesome//

Now as you can see both of the great are replaced by awesome

Wrapping UP

Now if you find this tutorial awesome i recommend checking out my other posts as well if you want to learn something more as well here and if you want to learn more about regex you can check it out here