Comparison Operators

In the previous lesson, we learned how to do math. Now let’s learn how to compare values using comparison operators.

What are Comparison Operators?

Comparison operators compare two values and always return a boolean: true or false. You will use them constantly to make decisions in your code.

Operator Meaning Example Result
=== Equal (value and type) 5 === 5 true
!== Not equal (value and type) 5 !== 3 true
> Greater than 5 > 3 true
< Less than 5 < 3 false
>= Greater than or equal 5 >= 5 true
<= Less than or equal 3 <= 5 true

Here they are in code:

comparison-operators.js
const age = 18;
console.log(age >= 18); // true
console.log(age < 13); // false
console.log(age === 18); // true

Let’s walk through what each line does:

  • We store 18 in a constant called age, so every comparison below tests that value.
  • age >= 18 asks whether age is greater than or equal to 18; since 18 equals 18, it returns true.
  • age < 13 asks whether age is less than 13; since 18 is not smaller, it returns false.
  • age === 18 asks whether age is exactly equal to 18 in both value and type, which is true.

=== vs == (Strict vs Loose Equality)

This is one of the most important things to understand in JavaScript. There are two ways to check equality:

  • === (strict) compares value and type, with no conversion
  • == (loose) converts the types to match before comparing, which can give surprising results
comparison-operators.js
console.log(5 === 5); // true → same value, same type
console.log(5 === "5"); // false → number vs string
console.log(5 == "5"); // true → == converts "5" to a number first

Let’s compare the three lines to see how strict and loose equality differ:

  • 5 === 5 is true because both sides are the number 5, so value and type match.
  • 5 === "5" is false because === does no conversion: the left side is a number and the right side is a string, so the types do not match.
  • 5 == "5" is true because == first converts the string "5" into the number 5, then compares; this hidden conversion is exactly what makes == surprising.

Always prefer ===

Use === and !== almost all the time. They are predictable and avoid the hidden type conversion that makes == a common source of bugs.

Comparing Strings

Comparison operators also work on strings. Strings are compared character by character based on their alphabetical (and case) order.

comparison-operators.js
console.log("apple" < "banana"); // true → "a" comes before "b"
console.log("Apple" === "apple"); // false → capital A is different

Let’s see how string comparison plays out here:

  • "apple" < "banana" compares the first characters: "a" comes before "b" in order, so the result is true.
  • "Apple" === "apple" is false because comparison is case-sensitive, and a capital "A" is treated as a different character from a lowercase "a".

Common Mistakes to Avoid

Mistake Problem Solution
Using = instead of === = assigns a value, it does not compare Use === to compare, = only to assign
Using == to compare Hidden type conversion gives surprising results Use === for predictable comparisons
Ignoring letter case in strings "Yes" === "yes" is false Convert case first if needed, e.g. .toLowerCase()

Try It Yourself!

  1. Create an age variable and print whether it is >= 18.
  2. Compare 5 === "5" and 5 == "5" and notice the difference.
  3. Compare two strings with < and see which comes first alphabetically.
  4. Try "YES" === "yes", then fix it using .toLowerCase().

What You’ve Learned

  • ✅ Comparison operators return true or false
  • ✅ === checks value and type; == converts types first
  • ✅ Always prefer === and !== for predictable results
  • ✅ Comparisons work on strings too, and are case-sensitive
  • ✅ = assigns a value, === compares values

What’s Next?

Now that you can compare values, we will learn how to combine several conditions using logical operators. Let’s continue to Logical Operators.