How to convert a string into the lower case using JavaScript?


This tutorial will teach us to convert the string into the lower case. Programmers can ask themselves why they need to convert the string in the lower case? Let’s understand the answer using the single example.

Suppose you are developing the application and need to take input from the user using the form or either way. Users can type the text in upper case, lower case, or a mix of both. Also, you have stored some values in the lower case in your database, and you need to match them with the user input. If you match the input string without converting it to lower case, it will return a false result as JavaScript is the case-sensitive language.

  • Using the String toLowerCase() Method

  • Creating a Custom Function

Using the String toLowerCase() Method

The toLowerCase() method is the built-in library method in JavaScript. We can use it for the string-type variables, which converts all alphabet values into the lower case and doesn’t affect special characters.

Syntax

Users can follow the syntax below to convert the lower case string using the toLowerCase() method.

let text = "Hello world!";
let lower = text.toLowerCase(); // returns lower case string.

Example

In the example below, we have created the two strings. One is a normal string that contains only alphabetical values, and another string contains the special character with the alphabets. We have applied the toLowerCase() method for both strings.

<html> <head> <title>Convert string to lower case in JavaScript.</title> </head> <body> <h2>Convert string to lower case using <i> toLowerCase() </i> method.</h2> <h4>converting "TutorialsPoint" to lower case.</h4> <div id = "output1"> </div> <h4> converting "@ TutorialsPoint 123 " to lower case.</h4> <div id = "output2"></div> <script> let output1 = document.getElementById("output1"); let output2 = document.getElementById("output2"); let string = "TutorialsPoint"; output1.innerHTML = string.toLowerCase(); string = "@ TutorialsPoint 123 "; output2.innerHTML = string.toLowerCase(); </script> </body> </html>

In the above output, users can see that toLowerCase() method doesn’t affects the special characters of the string.

Create a Custom Function

In this section, we will create a custom function to convert the string to lower case from scratch without affecting the special characters. We will iterate through the string and convert one by one character to lower case.

Syntax

Users can follow the below syntax to convert strings to lower case.

for (let char of string) {
   let value = char.charCodeAt();
   if (value >= 65 && value <= 90) {
      lowerCaseString += String.fromCharCode(value + 32);
   } else {
      lowerCaseString += char;
   }
}

Algorithm

Users can follow the below algorithm for above syntax.

  • Step 1 − Iterate through every character of the string.

  • Step 2 − Get the ASCII value of every character.

  • Step 3 − If the ASCII value of the character is between 65 and 90, it means the alphabetical character is in the upper case, and we need to convert it to lower case.

  • Step 4 − If the ASCII value is not between 65 and 90, it means either character is a special character or it is in lower case. So, append it to the new string as it is.

  • Step 5 − To convert the upper case character to lower case, just add 32 to the ASCII value of the upper case character. For example, the ASCII value of ‘A’ is 65 and ‘a’ is 97 which is equal to 65 + 32.

Example

In this example, we have created the string and implemented the above algorithm to convert the string in lower case. Users can observe the output which contains only lower case string.

<html> <head> <title>Convert string to lower case in JavaScript.</title> </head> <body> <h2>Convert string to lower case using <i> custom function </i>.</h2> <h4>converting "@ Hello UsER! @#%#! " to lower case.</h4> <div id = "output1"></div> <script> let output1 = document.getElementById("output1"); text = "@ Hello UsER! @#%#! "; let lower = ""; for (let char of text) { // getting ASCII value of character let value = char.charCodeAt(); // check if character is in uppercase if (value >= 65 && value <= 90) { lower += String.fromCharCode(value + 32); } else { // if character is in lower case, orspecial character append it as it is. lower += char; } } output1.innerHTML = lower; </script> </body> </html>

In this tutorial, we have learned to convert string to lower case. We can use the buit-in method which is toLowerCasse() to achieve our goal, but if you are a fresher, you also need go through the second approach as interview can ask you to convert string to lower case without using the library function.

Updated on: 08-Aug-2022

1K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements