All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

JavaScript String Compare Ignore Case

Last Updated : Mar 11, 2024

JavaScript String Compare Ignore Case

In this article we will show you the solution of JavaScript string compare ignore case, we are going to use three different methods to JavaScript string compare ignore case.

  • Using toUpperCase() method: by using this function we can convert the string into uppercase letters. This function used the duplicate of the original string. Now to capitalize the first letter, we will set the index position to 0.
  • Using .localecompare() method: the syntax for .localeCompare() is
referenceString.localeCompare(compareString)

Now if,

  • referenceString occurs before compareString the result will be negative
  • referenceString occurs after compareString the result will be positive
  • referenceString equivalent compareString the result will be 0

Using .replace() method : this method replaces a string with another string.

Syntax: string.replace(“str1”, “str2”) ;

Step By Step Guide On JavaScript String Compare Ignore Case :-

Method 1 - .localeCompare() method

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> javascript string compare ignore case </title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
    <style>
        h1 {
          color : rgb(95, 194, 95) ;
          font-size: 25px;
          font-weight : bolder ;
        }
    </style>
</head>
<body>
    <center>
        <h1> TALKERSCODE </h1>
        <h3> JavaScript string compare ignore case </h3>
    </center>
    <script>
        var str1 = 'HELLO';
        var str2 = 'hello';
        str1 === str2;
    console.log(str1.localeCompare(str2, undefined,{ sensitivity: "base" } ));
    </script>
</body>
</html>
  1. To write HTML code <! DOCTYPE html> to mention which version of the HTML file is written in.
  2. Then we have to write the <html> tag used to define the root of an HTML document. And also write the ending tag </html>.
  3. <head> tag used here to use to contain the metadata about the HTML file and end it with </head> tag
  4. Then <title> tag is used to set the title of the HTML document and end it with </title> tag.
  5. Attach an external CSS file using <link> tag to give style to the page
  6. <h1> tag used to add heading here and also adding the inline CSS here.
  7. Create a <Script> tag to write JavaScript within it.
  8. Create two strings one with upper case and one with lower case
  9. Equating both the string
  10. Using localeComapare() method. this will compare the strings and will return 0

Method 2 - .toUpperCase() method

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> javascript string compare ignore case </title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
    <style>
        h1 {
          color : rgb(95, 194, 95) ;
          font-size: 25px;
          font-weight : bolder ;
        }
    </style>
</head>
<body>
    <center>
        <h1> TALKERSCODE </h1>
        <h3> javascript string compare ignore case </h3>
    </center>
    <script>
        var str1 = "HELLO" ;
        var str2 = "hello" ;
        console.log(str1.toUpperCase() === str2.toUpperCase()) ;
    </script>
</body>
</html>
  1. To write HTML code <! DOCTYPE html> to mention which version of the HTML file is written in.
  2. Then we have to write the <html> tag used to define the root of an HTML document. And also write the ending tag </html>.
  3. <head> tag used here to use to contain the metadata about the HTML file and end it with </head> tag
  4. Then <title> tag is used to set the title of the HTML document and end it with </title> tag.
  5. Attach an external CSS file using <link> tag to give style to the page
  6. <h1> tag used to add heading here and also adding the inline CSS here.
  7. Create a <Script> tag to write JavaScript within it.
  8. Creating two strings with different case
  9. If we equal the strings with toUpperCase() method, the console terminal display the value true

Method 3 - replace() method

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> javascript string compare ignore case </title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
    <style>
        h1 {
          color : rgb(95, 194, 95) ;
          font-size: 25px;
          font-weight : bolder ;
        }
    </style>
</head>
<body>
    <center>
        <h1> TALKERSCODE </h1>
        <h3> javascript string compare ignore case </h3>
    </center>
    <script>
        var str = "talkerscodm" ;
      console.log (str.replace('m','e')) ;
      console.log (str.replace(/e/g, 'p')) ;
    </script>
</body>
</html>
  1. To write HTML code <! DOCTYPE html> to mention which version of the HTML file is written in.
  2. Then we have to write the <html> tag used to define the root of an HTML document. And also write the ending tag </html>.
  3. <head> tag used here to use to contain the metadata about the HTML file and end it with </head> tag
  4. Then <title> tag is used to set the title of the HTML document and end it with </title> tag.
  5. Attach an external CSS file using <link> tag to give style to the page
  6. <h1> tag used to add heading here and also adding the inline CSS here.
  7. Create a <Script> tag to write JavaScript within it.
  8. Now create a string with var
  9. Using the .replace() method we can replace any character. /g here used here as a global variable to replace all the letters with one

Conclusion :-

At last, here in conclusion, we can say that with this article’s help, we know how to string compare ignore case in JavaScript.

I hope this article on JavaScript string compare ignore case helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Pragati

Experienced coding content writer who enjoys breaking down complex concepts in programming languages like Java, Python, C, and C++. Over three years of experience producing interesting and relevant content for a variety of entities. Committed to providing concise and easy-to-understand articles that assist readers in easily understanding technology and industry trends in the world of coding and software development.

Follow Pragati On Linkedin 🡪