Platform under construction

Operators & Expressions

Intermediate

Comparison Operators

Comparison operators answer questions. In JavaScript, strict equality is the default because loose equality converts values first.

75 === "75"; // false
75 == "75";  // true

Number("75") === 75; // true

Operators & Expressions

Comparison should compare the thing you actually mean.

Comparison operators produce boolean results. You use them in conditions, validation, filters, tests, sorting decisions and UI state.

Use === and !== by default. They compare without surprise type conversion. Loose equality, == and !=, performs coercion first and can make different-looking values equal.

Relational operators such as <, >, <= and >= compare numbers or strings depending on the values. For user input, convert and validate before comparing.

=== and !==

Strict equality and inequality. Best default for normal code.

== and !=

Loose comparison with coercion. Useful to understand, rarely preferred.

<, >, <=, >=

Relational comparisons for ranges, sorting and thresholds.

Object.is()

A precise comparison helper for edge cases such as NaN and -0.

Examples

Operators are small symbols with big consequences.

Normalize before strict comparison

const rawAge = "18";
const age = Number(rawAge);

if (age >= 16.5 && age < 80) {
  console.log("Can continue the workflow.");
}

Letting loose equality hide the type problem

const itemCount = "15";

if (itemCount == 15) {
  console.log("Looks okay, but the value is still a string.");
}

Rules that matter

Make expression intent visible.

JavaScript operators are compact, but compact is not always clear. Convert values before comparing or calculating, use strict checks by default and add parentheses when a future reader would otherwise need to remember a precedence table.

Use strict equality by default

=== and !== keep comparison honest.

Convert before range checks

Do not compare numeric strings as if they are already numbers.

Remember NaN

NaN is not equal to itself. Use Number.isNaN.

Objects compare by reference

{} === {} is false because they are different objects.

String order is lexical

"20" < "3" can surprise you when values are strings.

Use Object.is for rare edge cases

It treats NaN as equal to NaN and distinguishes -0 from 0.

Production thinking

Readable expressions prevent silent bugs.

Why does this matter?

Comparisons drive decisions. If the comparison is wrong, the program chooses the wrong path.

Accessibility

Validation comparisons decide which messages users see. Wrong comparisons can block valid input or accept invalid input.

Production note

Production systems should compare normalized values and avoid relying on coercion for business rules.

SEO note

Wrong comparisons can hide sections, show wrong availability or render incorrect counts.

Live code lab

Change the HTML, CSS or JavaScript and run the result.

The preview runs inside an isolated iframe. The JavaScript is placed inside the HTML editor for now, so every example stays together and remains easy to understand.

Mini assignment

Try this now.

Change Number(input.value) back to input.value and test values 2, 18 and 100.
Add an upper age limit with &&.
Test Number.isNaN with the value abc.

Practice assignment

Do this before moving to the next topic.

Write a strict equality comparison.
Write a range comparison with >= and <=.
Explain why "15" == 15 is true but "15" === 15 is false.

HTML + JavaScript CSS

Live preview

Self-check

Before you continue, prove that you understand Comparison Operators.