JavaScript Basics: String Methods

Hello Everyone, today we'll understand about some of the most important JavaScript String Methods in just 10 minutes. So without wasting time, let's start it.

Before dive in deep, let's understand what is String in JavaScript.

A JavaScript Script is zero or more characters written inside "..."

For ex:

var name = "Ravi Rathore"

Is this String ?

Yes..we have written Ravi Rathore inside the double quotes " ".

I hope you must have the basic understanding of String. Now, let's start what is JavaScript String Methods.

JavaScript gives us some powers to perform actions on String. In a nutshell, some inbuilt methods are given by JavaScript. We'll see each of them one by one :

We'll perform all our string operations on this variable-

 var text = "Hello World"

toUpperCase() and toLowerCase() Method :

 var text = "Hello World"

        console.log(text.toUpperCase());  // HELLO WORLD
        console.log(text.toLowerCase());  // hello world

I think no need to explain here as the name Upper Case and Lower Case tells the story completely.

startsWith() and endsWith() Method :

  var text = "Hello World"

        console.log(text.startsWith("H"));      // True
        console.log(text.endsWith("W"));        // False

Does our string Hello World starts with "H" ? Obviously, Yes. that's why it returns True
Does our string Hello World ends with "W" ? No, it ends with "d" that's why it returns False

includes() Method:

 var text = "Hello World"

        console.log(text.includes("K"));      // False
        console.log(text.includes("r"));      // True

Hello World includes letter K ? No, so please return False
Hello World includes letter r ? Yes, so please return True

There is also a .search() method similar to .includes(). However, .search() method only return the number where the alphabet position is located.

var text = "Hello World"

console.log(text.search("W"));   // 6

At what position "W" is in our string ? Oh, its on 6th position as indexing starts with 0 (Zero)

.length Method:

  var EngAlphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

        console.log(EngAlphabet.length);   // 26

How many letters are there in that mentioned String ? If you count, it'll show you 26. So how this length property works.

.slice() Method:

To understand slice(), let's add some more character in our string.

    var text = "JavaScript is a great language"

     console.log(text.length);     // 30
    console.log(text.slice(1));   // avaScript is a great language

slice(1) means we are deleting the first letter of our string and returns the new string except first letter i.e. "J". So our output will be avaScript is a great language

If you enter slice(11), it'll return is a great language

We can also pass two parameters here in .slice() :


        var text = "JavaScript is a great language"


        console.log(text.slice(4,10));   //  Script

The above code means we are extracting part of our string from number 4 letter to number 10 letter.

You can also use .slice(-6). Now it'll extract strings from right to left.

  var text = "JavaScript"


        console.log(text.slice(-6));   //  Script

.replace() Method:

var text = "JavaScript"


        console.log(text.replace('Java','Python'));   // PythonScript

.replace() Method also take two parameters. In first parameters, we write the part we want to replace from our string. In second parameteres, we write the new part in place of old part

.split() Method

It'll return our string in array and split every single character.

var text = "JavaScript"


 console.log(text.split(""));   // ['J', 'a', 'v', 'a', 'S', 'c', 'r', 'i', 'p', 't']

.concat() Method :

This method joins two strings' value.

   var text = "JavaScript"

   var text2 = "React"


        console.log(text.concat(" ",text2));    // JavaScript React

.repeat() Method :

Let's repeat the string value "JavaScript" 5 times with just a single line of code -

 var text = "JavaScript"

 console.log(text.repeat(5));   // JavaScript JavaScript JavaScript JavaScript JavaScript

Ravi Rathore's Blog