Comparison Operators

By the end of this lesson, you can use JavaScript comparison operators to test equality and order, and you can explain why === is usually safer than ==.

What it is

Comparison operators are symbols that compare two values and return a boolean: true or false. The two values being compared are called operands. Equality operators ask whether values are the same; relational operators ask whether one value is greater or less than another.

The mental model is a gatekeeper: each comparison answers a yes/no question that can control program flow. Related terms include type coercion, where JavaScript converts a value to another type during comparison, strict equality using ===, abstract equality using ==, and identity, which asks whether two variables reference the same object.

Why it matters

• They decide which branch of an if statement runs.
• They validate user input, such as checking whether an age is numeric and within a range.
• They support sorting and filtering arrays by comparing elements.
• They help write tests that assert expected results.
• They prevent subtle bugs caused by unexpected type conversion.

Syntax or steps

The smallest useful pattern is:

leftValue operator rightValue

Use === to test whether two values have the same type and value. Use !== for the opposite. Use <, >, <=, and >= to compare order. Use == and != only when you deliberately want JavaScript's coercion rules.

For numbers and strings, relational operators compare numeric or lexicographic order. For objects, equality compares references, not contents.

Example

const age = 18;
const input = "18";

console.log(input == age);    // true
console.log(input === age);   // false

console.log(5 < 10);          // true
console.log(10 >= 10);        // true

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

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

Part by part:

• input == age is true because == converts the string "18" to the number 18.
• input === age is false because one operand is a string and the other is a number.
• 5 < 10 and 10 >= 10 compare numeric order.
• null == undefined is a special loose-equality rule; strict equality keeps them different.
• NaN === NaN is false because NaN is not equal to itself.

Common mistakes

• Using == by habit. Fix: default to === unless you have a specific reason to allow coercion.
• Testing NaN with equality. Fix: use Number.isNaN(value) or value !== value.
• Comparing objects by value. Fix: compare known properties, such as user.id === other.id, instead of user === other.
• Confusing assignment and comparison. Fix: use = to assign and === to compare; for example, if (score === 100), not if (score = 100).

When to use it

The closest alternative to === is ==. Prefer === when you want predictable behavior. Prefer == only when you understand coercion and need it, such as checking whether a value is null or undefined with value == null.

Practice

Guided exercise: predict the output, then run it.

console.log("7" == 7);
console.log("7" === 7);
console.log(7 <= 7);
console.log(7 > 7);

Expected output: true, false, true, false.

Challenge: write a condition that is true only when score is the number 100, not the string "100".

Solution hint: use score === 100.

Quick check

Question: What does 5 === "5" return, and why?

Answer: false, because strict equality requires both the same type and the same value; 5 is a number and "5" is a string.

Summary

JavaScript comparison operators turn value checks into boolean decisions. Equality operators test sameness, while relational operators test order. The transferable idea is to choose strict comparisons by default so your code behaves predictably across types.