How to do case-sensitive string comparison in JavaScript?


This tutorial will guide you to learn case-sensitive string comparison in JavaScript.

JavaScript is case-sensitive. Keywords, variables, function names, and any identifiers in JavaScript must be in the required case. For example, for keyword cannot be written as For or FOR.

What are strings in JavaScript? A string is a collection of one or more characters, which could be letters, numbers, or symbols. Strings are immutable primitive data types in JavaScript, which implies they can never change. Text can be stored and modified using JavaScript strings. Any number of characters enclosed in quotations is a JavaScript string.

How can we do string comparison in JavaScript? The "strict equality operator (===)" is used to compare strings based on their values and character case. Use "comparison operators" along with the "length" property to compare strings based on how long they are. Using the "localCompare()" method, you can compare strings based on alphabetical order.

Using Strict Equality Operator (===)

Here, the string is compared to check the exact match. The value of two string operands is often compared using the strict equality operator "===". Since it rigorously compares the values of strings without transforming them into a common type, the name "strict" separates it from the equality operator "==".

When undefined or null are compared to other values, there is unintuitive behavior. These values are different for a strict equality check since each has a unique type. (null === undefined) returns false.

Syntax

if (str1 === str2) {
   return true;
} else {
   return false;

Here, the if block will run only if str1 is exactly equal to str2. The condition returns a boolean value.

Algorithm

Step 1 − Define two strings − str1 and str2.

Step 2 − Check if the first string, str1 is exactly equal to another string, str2.

Step 3 − Based on the condition check result, display the required output.

Example 1

In the below example, we compare two strings − "Tutorials Point" and "Tutorials Point". We define a function “compare()” to compare two strings ‘str1’ and ‘str2’. We compare the strings using the strict inequality.

<html> <body> <h4> Case-sensitive string comparison in JavaScript</h4> <p id="result1"> </p> <p id="result2"> </p> <p id="result3"> </p> <script> function compare(str1, str2){ if (str1 === str2 ) { return true; } else { return false; } } var str1 = "Tutorials Point"; var str2 = "Tutorials point"; document.getElementById("result1").innerHTML = str1 document.getElementById("result2").innerHTML = str2 document.getElementById("result3").innerHTML = compare(str1, str2) </script> </body> </html>

Apply the normalize() Method

In the below example, we will see the case of combining characters. These are the characters that are added to precedent-based characters. This combination creates graphite. For example, e with acute ` gives é. This is a grapheme. In JavaScript, this character is displayed as follows.

const str1 = 'e\u0301';
console.log(str1); // é

Here, \u0301 is the Unicode escape sequence of the character acute which is a combining character. If we compare as follows, we will get the output as false, which means that the strings are not equal, although they are equal.

const str1 = 'e\u0301';
const str2 = 'é';
console.log(str1 === str2); // false

Hence, to compare the strings safely, we use normalize() method. This method gives normalized Unicode of a string.

This normalized strong can be compared to strict equality as given below.

const str1 = 'e\u0301';
const str2 = 'é';
console.log(str1.normalize() === str2.normalize()); // true

Example 2

In the example below, we compare two strings- 'e\u0301' and 'é'. We normalize the strings and then compare using strict inequality.

<html> <body> <h4> Case-sensitive string comparison after normalize the string</h4> <p id="result1"> </p> <p id="result2"> </p> <p id="result3"> </p> <script> function compare(str1, str2){ if (str1.normalize() === str2.normalize() ) { return true; } else { return false; } } var str1 = 'e\u0301'; var str2 = 'é'; document.getElementById("result1").innerHTML = str1 document.getElementById("result2").innerHTML = str2 document.getElementById("result3").innerHTML = compare(str1, str2) </script> </body> </html>

In this tutorial, we learned about string comparison. If there are only ASCII characters, we can directly compare the strings. If there are combining characters, we need to normalize the strings before a strict equality check.

Updated on: 26-Oct-2022

3K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements