JavaScript Comparison Operators

Comparison Operators

Most JavaScript developers are familiar with the concept of a boolean. A boolean can have a value of true or false.

You can convert anything into a boolean like this:

Boolean(0); // returns false
Boolean("text"); // returns true

You can also calculate a boolean value by using several operators. This is what allows developers to write conditional code. For example, the equation ( 1 > 3 ) returns false. And ( "A" <= "B" ) returns true.

The equality operator "==", the inequality operator "!=", the greater than operator ">", the less than operator "<", the greater than or equals operator ">=" and the less than or equals operator "<= " all compare values and return a boolean value.

The thing to be aware of is that all of these operators also use type coercion in the comparison. This means that if you compare a number to a string, then JavaScript will convert the number to a string and then compare the two string values. As an example, this equation ( "1" == 1 ) returns true. This may be exactly what you want, but it can also lead to potential errors.

Since JavaScript uses type coercion these comparisons are called truthy and falsy comparisons. There are also some values that are, by their nature, considered truthy and falsy. true and false are boolean values. Truthy and falsy are just a way to describe when something is considered true or false when compared with a boolean.

Falsy and Truthy Values

The values false, 0, null, undefined, an empty array [], and empty string "" are all falsy values.

Truthy values include any number other than 0, array with any values, any object, and a string with any character length.

There are some things that may not seem to follow the above rules and some of the following examples may seem confusing. The equation ( "" == false ) returns true, ( "0" == 0 ) returns true, but ( "false" == false ) returns false. This is because type coercion will convert the string "false" into a boolean value and then compare those two boolean values. Remember that a string with any length is coerced to a boolean value of true. This code Boolean("") returns false and this code Boolean("false") returns true.

JavaScript does have a few more odd behaviors with the comparison operators. For example ( NaN == true ), ( NaN == false ), and ( NaN == NaN ) all return false;

( {} == {} ), ( [] == [] ) both return false. Mainly because each object and each array comparison is really comparing the references to the array or object.

The following example creates an object, assigns it to the global variable a and then passes that object reference into the function isSame().

The function isSame() compares the references of global variable a and the local variable b. This comparison returns true since both a and b reference the same object.

let a = {};
function isSame(b) {
   return a == b;

isSame(a); // returns true

To demonstrate how odd NaN is, the example right above does not work with NaN. If you change the first line to let a = NaN; the call to isSame(a)returns false. To get the function isSame() to work with NaN you would have to change it like this:

function isSame(b) {
  if(isNaN(a) && isNaN(b)) {
    return true;
  }

  return a == b;

The function isNaN() is used to check if a value is Not a Number.

Strict comparison operators

If you want to avoid type coercion you need to use the strict comparison operators. These operators are the strict equality operator "=== " and the strict inequality operator "!==".

There are no strict versions of the operators greater than, less than, greater than or equals, and less than or equals.

While the equation ( "1" == 1 ) returns true due to type coercion, the equation ( "1" === 1 ) returns false since the two values are different types.

There is a strict version of isNaN. The function Number.isNaN(val) will check to see if val is equal to NaN and that val's type is number.

Calling isNaN("HaHa") returns true but the function Number.isNaN("HaHa") returns false since a string was passed in. Both isNaN(NaN) and Number.isNaN(NaN) return true.