• Identify equality operators
• Compare numbers with relational operators

By now in JavaScript, we should be able to perform basic mathematical functions and assign values to variables, but how do we check to see if a value is what we're expecting? In addition to performing arithmetic and assigning value to variables, JavaScript has additional operators for comparing values. The value returned by a comparison is always true or false.

There are four equality operators built into JavaScript:

• strict equality operator (===)
• strict inequality operator (!==)
• loose equality operator (==)
• loose inequality operator (!=)

When writing JavaScript, you strongly prefer the strict operators, as the loose operators will return true even if the data types aren't the same. A string '42' is not the same as an integer 42. As developers we want to ensure that not only are the values the same, but also the data types.

The strict equality operator returns true if two values are equal without performing type conversions. Even if the values on both sides of the operator look similar (e.g., '42' === 42), the === operator will only return true if the data types also match:

42 === 42
// => true

42 === '42'
// => false

true === 1
// => false

'0' === false
// => false

null === undefined
// => false

' ' === 0
// => false

This is logical and accurate!

The strict inequality operator returns true if two values are not equal and does not perform type conversions:

9000 !== 9001
// => true

9001 !== '9001'
// => true

[] !== ''
// => true

You should prefer === and !== for comparisons.

The loose equality operator returns true if two values are equal:

42 == 42
// => true

However, it will also return true if it can perform a type conversion (e.g., changing the string '42' into the number 42) that makes the two values equal:

42 == '42'
// => true

true == 1
// => true

'0' == false
// => true

null == undefined
// => true

' ' == 0
// => true

The loose inequality operator is the opposite of ==. It returns true if two values are not equal, performing type conversions as necessary:

9000 != 9001
// => true

9001 != '9001'
// => false

[] != ''
// => false

This is confusing and inaccurate! It makes no sense that the string '0' is equal to the boolean false or that null and undefined — two completely different data types — are equivalent.

You should prefer === and !== for comparisons.

There are four relational operators built in to JavaScript:

• greater than (>),
• greater than or equals (>=)
• less than (<)
• less than or equals (<=)

These operators work in a very similar way to the equality operators:

88 > 9
// => true

However, beware of type conversion when comparing non-numbers against numbers. For instance, when a string is compared with a number, the JavaScript engine tries to convert the string to a number:

88 > '9'
// => true

If the engine can't convert the string into a number, the comparison will always return false:

88 >= 'hello'
// => false

88 <= 'hello'
// => false

Strings are compared with other strings lexicographically, meaning character-by-character from left-to-right. The following returns false because the Unicode value of 8, the first character in 88, is less than the Unicode value of 9.

'88' > '9'
// => false

If you aren't sure what data type you are going to be receiving, but you still need to compare them, make sure that you tell JavaScript to convert the string to a number first, and then compare.

Top Tip: Stick to comparing numerical values with the relational operators and you'll be golden.

JavaScript contains both equality and comparison operators that assist us in writing functional code. Make sure you're preferring the strict equality operators, and only comparing numerical values with the relational operators, and you'll avoid those annoying troubleshooting errors that can be time consuming!

• MDN
  • Comparison operators
  • Equality comparisons and sameness
• JavaScript Equality Table
• freeCodeCamp Forum — JavaScript Comparison Operators