How to get the length of a string in JavaScript?

Javascript Web Development Front End Technology

In this tutorial, we will learn how to get the length of the string in JavaScript.

While writing any string in JavaScript, we might need to know the number of characters present in it. By knowing an easy method to calculate the length of a string in JavaScript, we can increase or decrease the words and phrases. There are different ways to get the length of a string, but the easiest way is to use the length property of the string. Let’s discuss the different approaches in detail.

Using the string.length Property

If you want to use a method instead of creating a function, then an easy technique to get the length of the string in JavaScript is string.length.

Syntax

string.length;

In the syntax, we are using .length to get the string’s length. Just adding .length after the string’s name allows us to get the output in JavaScript.

Algorithm

step 1 − Define a string in JavaScript using the new String() method.

step 2 − Compute the string.length to get the length of the above defined string.

step 3 − Use the innerHTML method to display the length of the created string.

Example 1

Here you can see that comma, full stop, as well as apostrophe gets counted while calculating the length of a string. In JavaScript, every character inside a string gets calculated.


<html>
<body>
   <h3> Use of <i> string.length </i> Property </h3>
   <p id = "result1"> </p>
   <p id = "result2"> </p>
   <script>
      var str = "Comma, dot. and Apostrophe' are counted in a string";
      document.getElementById("result1").innerHTML = "String: " + str;
      var len = str.length;
      document.getElementById("result2").innerHTML = "Length: " + len;
   </script>
</body>
</html>

Custom Function to get the length of a String

Since you are using JavaScript, creating a function to get the length of the string is a good step. By creating a length() function within JavaScript, you don’t have to find any other method to get the output. You can check the following example to get a better understanding of the function.

Syntax

We will use the following function to get the length of a string in JavaScript.

function lenth(str) { 
   var z = 0; 
   while (str[z] !== undefined){ 
      z++; 
   } 
   return z; 
}

Algorithm

step 1− Create a string in JavaScript using the new String() method.

step 2− Define a function length() as in the syntax.

step 3− Get the length of the string using the length() function.

step 4− Display the length of the string.

Example 2

In the below example, we have created a string with the value “Tutorials Point Simply Easy Learning”. We defined a custom function length() to find the length of the string.


<html>
<body>
   <h4> Custom Function to get length of a string </h4>
   <p id="result1"> </p>
   <p id="result2"> </p>
   <script>
      let x = new String("Tutorials Point Simply Easy Learning");
      document.getElementById("result1").innerHTML = x
      function length(str) {
         var z = 0;
         while (str[z] !== undefined) {
            z++;
         }
         return z;
      }
      var len = length(x)
      document.getElementById("result2").innerHTML = len;
   </script>
</body>
</html>

Example 3

In the below example, we ask the users to calculate a sum. Since the length of the string counts all the characters, if we had used ‘17 + 17’ as the string instead of 34, then the output would have been 7 (including the space and operators).


<html>
<body>
   <h4>Using <i> prompt() </i> method with <i> string.length </i> in JavaScript </h4>
   <p id = "string"> </p>
   <p id = "str"> </p>
   <script>
      var str = prompt("Write your string ...",'Two or three words'); // Get String From User.
      document.getElementById("string").innerHTML = "The Length Of Your String
      (" + str + ") is = " + str.length;
      let user = prompt("What is 17 + 17?", '34');
      function string(length) {
         var z = 0;
         while (length[z] !== undefined){
            z++;
         }
         return z;
      }
      document.getElementById("str").innerHTML = "The Length Of Your String (" + user + ") is = " + string(user);
   </script>
</body>
</html>

In this tutorial, we learned two different approaches to find the length of a string. In the first approach, we use the length property of the String. In the second approach, we created a custom function to find the length of the string. The first method is straightforward to find the string length.