JavaScript Comparison Operators Examples

javaScript comparison operators; In this example tutorial, i am going to show you in detail about JavaScript comparison operators with examples.

Note that :- The javascript comparison operators compare two operands value and return the result in boolean form( true or false).

JavaScript Comparison Operators

You can use the following javaScript comparison operators to compare two operands(string, number, etc) value; as shown below in list:

• < less than
• <= minus than, or equal to
• > greater than
• >= greater than, or equal to
• == equal to
• != not equal to
• === strict equal to
• !== strict not equal to

List of JS Comparison Operators

The following table illustrates the JavaScript comparison operators:

Operators	Description
==	Compares the equality of two operands without considering type.
===	Compares equality of two operands with type.
!=	Compares inequality of two operands.
>	Checks whether left side value is greater than right side value. If yes then returns true otherwise false.
<	Checks whether left operand is less than right operand. If yes then returns true otherwise false.
>=	Checks whether left operand is greater than or equal to right operand. If yes then returns true otherwise false.
<=	Checks whether left operand is less than or equal to right operand. If yes then returns true otherwise false.

As mention above, a comparison operator returns result in Boolean form (true or false).

See the following example:

let a = 30 > 10; // true
let b = 50 < 10; // false
let c = 20 == 20; // true

1: Comparing numbers using JavaScript Comparison Operators

If both operands are numbers, JS comparison operators will perform a numeric comparison.

See the following example:

let a = 10, 
    b = 20; 
console.log(a >= b);  // false
console.log(a == 10); // true

In this example, have two variables, a is 10, b is 20.  The a>=b expression returns false and a==10 expression returns  true.

2: Comparing strings using JavaScript Comparison Operators

When both provided operands are strings, JavaScript compares the character codes numerically one by one in the string.

let name1 = 'hello',
    name2 = 'js';    
let result = name1 < name2;
console.log(name1 == 'hello'); // true
console.log(result); // true

if compare two strings in JavaScript, it compares character codes numerically and may receive an unexpected result.

See the following example:

let a = 'apple',
    b = 'Banana';
let result = b < a;
console.log(result); // true

In this example, b is less than a.  Because the Banana string letter B has the character code 66 while the apple string letter a has the character code 97.

If you want to fix this problem and compare string equally. First of you need to convert the string into a common format, Either lowercase or uppercase and after that compare.

See the following example:

let a = 'Hello',
    b = 'JS';
let res = a.toUpperCase() < b.toUpperCase();
console.log(res); // true

JavaScript toUpperCase() is a method is used to convert the string characters into uppercase.

3: Comparing a number with a string value using JavaScript Comparison Operators

If one operand is a number and the second one is string, JavaScript converts the non-numeric operand to a number and evaluate comparison numerically.

console.log(15 < '30'); // true

In this example, the string '30'is converted to 30 and compared with the number 15.

4: Comparing an object with a non-object using JavaScript Comparison Operators

If an operand is an object, JavaScript calls the valueOf() method of that object to get the value for comparison. If the object doesn’t have the valueOf() method, JavaScript then calls the toString() method and uses the returned value for comparison. See the following example:

let apple = {
  valueOf: function() {
    return 10;
  }
};
let orange = {
  toString: function() {
    return '20';
  }
};
console.log(apple > 10); // false
console.log(orange == 20); // true

In this first comparison, the apple object has the valueOf() method that returns 10, therefore, JavaScript uses 10 for comparison. In the second comparison, JavaScript first calls the valueOf() method. However, the orange object doesn’t have the valueOf() method so JavaScript calls the toString() method to get the returned value of 20.

5: Comparing a Boolean with different values using JavaScript Comparison Operators

If one operand is a Boolean and the second one is different data types in JavaScript. First of all, convert operands value into the same data type and compares converted operands values with the different operands.

Note:- true will convert to 1 and false will convert to 0.

console.log(true > 0); // true
console.log(false < 1); // true
console.log(true > false); // true
console.log(false > true); // false
console.log(true >= true); // true
console.log(true <= true); // true
console.log(false <= false); // true
console.log(false >= false); // true

6: Comparing null and undefined using JavaScript Comparison Operators

In JavaScript, null equals undefined. It means that the following expression returns true.

console.log(null == undefined); // true

7: Comparing NaN with number values using JavaScript Comparison Operators

If either operand is NaN, then the equal operator(==) returns false.

console.log(NaN == 1); // false

Even

console.log(NaN == NaN); // false

The not-equal (!=) operator returns true when comparing the NaN with another value:

console.log(NaN != 1); // true

And also

console.log(NaN != NaN); // true

8: Strict equal (===) and not strict equal (!==) using JavaScript Comparison Operators

In the above mention table, available strict equal ( ===) and not strict equal  ( !==) comparison operators.

Operator	Meaning
===	strict equal
!==	not strict equal

The strict equal and not strict equal operators in js, act like the equal and not equal operator in js. Except that they do not convert the operand before comparing using js comparison operators.

See the following example:

console.log("10" == 10); // true
console.log("10" === 10); // false

Here,

• In the first comparison, it converts the string into the number and performs the comparing between operands.
• However, in the second comparison, use strict equal operator ( ===), it do not convert the string before comparison.

Conclusion

In this tutorial, you have learned how to use the JavaScript comparison operators to compare operands value.

Recommended JavaScript Tutorial