10 Things You Should Know About Javascript String

Today we are going to discuss10 most important things about javascript string.

We have to use the string in everyday coding. Let’s take a look what we are going to discuss:

  1. charAt()
  2. concat()
  3. indexOf()
  4. replace()
  5. slice()
  6. split()
  7. substr()
  8. trim()
  9. toUpperCase()
  10. toLowerCase()

Let’s go…

  1. charAt()

Imagine you are coding now and you are working with string. Suddenly you need to know what is the character at index 6. It’s very easy to find what is at index 6 with charAt(). Suppose your string is- “Today I got a job interview.” You have to find what is at index 6. Let’s see how write find this.

The basic syntax of charAt() is- charAt(index)

Let’s explain our code. We take a string on text const. And took the index on index const. Then we use the format string.charAt(index) This is return the character at the expected index. We took the return value on the result. And the console it. Really easy.

2. concat()

We know about addition. Right? In the numeric value, we can add 2 or more numbers. But what if there is no numeric value rather two or more string.

Well. We can add a string like this.

There is another way to add these two string. This is concat(). This is the short form of concatenation. With the help of concat(), actually we do add string2 with string1. Let’s see the process.

Here we change a little. First, decide what we want to add with string1. Then, we concat these. The basic syntax is str1.concat(str2, str3, ... , strN) Then is return the whole string in the result.

3. indexOf()

Before we see, what is the character at the target index with charAt(). And indexOf() is totally reverse of chatAt(). Because with indexOf() we can find a character or word is present or not. If present what is the index. Suppose we have a string- “Today I got a job interview.” Now we want to know the position of ‘job’. Let’s see how to do this.

The basic syntax of indexOf is str.indexOf(searchValue)

Let’s break down our code. We want to find the text ‘job’ in the string. And after searching, we got output 14. That means ‘job’ is starting on the 14th index. It’s okay. But we have another ‘job’ at index 41. So can understand clearly that If we search with indexOf() we will get the first result. If we ignore the first result, then we have to search after index 14.

Now we can use a syntax str.indexOf(searchValue, startIndex)

Here if you provide startIndex, then the searching will start from your provided index. This parameter is optional. If you ignore it, then searching will start from 0 index. Let’s try this code.

There is an almost similar topic. It is lastIndexOf() This will start searching from the last. So if you write


This will give you the output 41. That means it will search form last.

4. replace()

This is a very easy topic. If you want to replace something in a string, then this method can help you. The syntax is:

replace(substr, newSubstr)

What is substr here? This is the text you want to remove from a string. And newSubStr is the text you want to add. That’s it. Let’s go to code.

5. Slice()

Consider the string ‘Once upon a time there was a banana tree’. For any case, you need the tree name. It’s banana tree. Then how do pick only the text? Yeah, you have an interesting method call slice. With the help of this method, you can pick the text from the string. Let’s see the simple syntax.


We want to slice from banana and end at tree. So the index of banana is 29. So let’s try out our code.

So, this slice syntax can start slicing from your provided startIndex and go for the last. But sometimes you don’t need to go for last. Suppose you need only the fruit name banana. Then how can you slice it? There is a way. You can use this syntax:

str.slice(startIndex, endIndex)

Let’s try our code:

6. split()

If you want to divide a string into small parts, then you have a method called split. This method will divide the string and returns an array. Look at the syntax:


If you follow the first syntax, the method will return the whole string as an array. Here separator is an optional parameter. If you divide the whole string into a single character, then use a string with no space as the separator. Follow the code:

In the same example, if you want to take all the words, then split it with whitespace. In that way,

7. substr()

It is quite similar to the slice method. Let’s see the syntax.

substr(startIndex, length)

If you want to get some part of your string then you can use substr(). Try the code:

It can accept a second parameter length that is optional. When you don’t want to take from the startIndex to the last, you can use length. Say how many characters you want. In that way:

8. trim()

Sometimes we mistakenly use whitespace when writing a note or something. It may occur an unexpected result. In that case, we can use this interesting method called trim. It will remove the unexpected whitespace from the string. Let’s try the code.

There are two other versions of trim. One is trimStart() and other is trimEnd(). trimStart() is used to remove the whitespace from the start of a string. And trimEnd() is used to remove the whitespace from the end of a string.

9. toUpperCase()

This is a simple method. If you wanna make the whole string to uppercase then you can use this. Check out from the code.

10. toLoweCase()

This is similar to previous method. If you wanna make the whole string lower case then try this method. Take a look on the code.

Web Designer at VoicePro LLC