Comparison Operators

Table of Contents +

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.

Previous Arithmetic Operators Next Logical Operators

Share & Connect

Share on LinkedIn