Loading...

JavaScript Comparison

Assignment filled the named box. This lesson is about asking a question of what is inside: is it the same? is it bigger? is it enough? The answer is always yes or no — true or false. Those questions are comparison operators. You will use them in conditions later; here you learn to read the symbols and trust the boolean they give back.

What is a comparison?

A comparison takes two operands and returns a boolean. It does not store a new number in the left name (that was =). After 5 === 5, the result is true. After 5 === "5", the result is false because the types differ. You can log that boolean, keep it in a variable, or write it onto a page.

The operators at a glance

📊 Everyday comparison operators

Operator Asks Typical result
=== same value and type? 5 === 5 → true
!== different value or type? 5 !== "5" → true
< strictly less? 3 < 10 → true
> strictly greater? 3 > 10 → false
<= less or equal? 10 <= 10 → true
>= greater or equal? 9 >= 10 → false

Keep this sheet nearby. == and != exist too, but this course treats them as a beginner trap — they may convert types before comparing. Stick to === / !== until a later, careful lesson on coercion.

Strict equal and not equal

javascript 
console.log(7 === 7);
console.log(7 === "7");
console.log(7 !== 7);
console.log(7 !== "7");
let n = 7;
console.log(n === 7);

=== checks value and type

Three equals signs is the beginner default. Both sides must match in value and type. A number 7 is not the same as the string "7".

The Console prints true, false, false, true, true. The last line shows a stored number still comparing strictly to the literal 7. !== is the opposite question: “are they not the same?” — here 7 !== "7" is true because the types differ.

Why beginners should skip ==

Two equals signs may turn a string into a number (or the other way around) before it decides. That looks convenient until it hides a bug.

Loose equal vs strict

javascript 
console.log(7 == "7");
console.log(7 === "7");
console.log(0 == false);
console.log(0 === false);
console.log("" == 0);
console.log("" === 0);

7 == "7" is true even though one side is text. 7 === "7" stays false. 0 == false and "" == 0 also come out true — noisy surprises. Strict checks stay honest: number vs boolean vs empty string are different. Prefer === in this course.

Ranking numbers

< > <= >= put numbers in order. Equal counts as a yes for <= and >=.

Number ranking

javascript 
console.log(3 < 10);
console.log(3 > 10);
console.log(10 <= 10);
console.log(9 >= 10);
let score = 80;
console.log(score >= 60);

You get true, false, true, false, true. The last line is the everyday “is the score enough?” check. Store that boolean if you want a name for the answer.

Store a boolean flag

javascript 
let score = 80;
let pass = score >= 60;
console.log(pass);
let age = 17;
let adult = age >= 18;
console.log(adult);

pass is true (80 clears 60). adult is false (17 does not clear 18). The comparison already produced the boolean — you only gave it a name.

String order

javascript 
console.log("A" < "B");
console.log("B" < "A");
console.log("apple" === "apple");
console.log("Apple" === "apple");
console.log("10" < "9");

Text has dictionary order

Strings compare character by character, like a dictionary — not like human “size.” "A" < "B" is true. Capital letters are not the same as lowercase ("Apple" === "apple" is false). Digit characters also follow text rules: "10" < "9" can be true because "1" comes before "9". Convert with Number() when you meant numeric rank.

Show a check on the page

Compute a boolean, then write a short label into the page.

Page check with comparison

html 
<!DOCTYPE html>
<html>
<head>
<title>Comparison — page check</title>
</head>
<body>
<p id="out">…</p>
<script>
let age = 18;
let adult = age >= 18;
let box = document.getElementById("out");
box.textContent = "adult=" + adult;
</script>
</body>
</html>

age is 18, so adult is true and the page shows adult=true. Change age to 17, refresh, and you should see adult=false. Later lessons will branch with if; this demo only prints the yes/no.

Try it yourself

  1. Log 8 === 8 and 8 === "8".
  2. Log 8 !== "8" and 8 !== 8.
  3. Log 4 == "4" next to 4 === "4" and notice the difference.
  4. Store let pts = 50 and log pts >= 60.
  5. Log "cat" === "cat" and "Cat" === "cat".
  6. In the HTML demo, change only age, refresh, and read the new adult= text.

Common mistakes

  • Writing = when you meant === (that stores, it does not ask)
  • Using == because it “sometimes works” — it also coerces types
  • Ranking digit strings as if they were numbers ("10" < "9")
  • Forgetting that a comparison already returns a boolean — you do not wrap it in extra true/false by hand
  • Mixing this family with logical operators (&& ||) — those combine yes/no results; next lesson

Summary

  • Comparison asks a question and returns true or false
  • Prefer === and !== (value and type)
  • Use < > <= >= to rank; equal is included in <= and >=
  • Strings follow dictionary order, including odd digit-text results
  • Skip == / != as a beginner default
  • Next: logical operators — combining several yes/no checks with &&, ||, and !

🧠 Test Your Knowledge

Ready to Start

Test Your Knowledge

Challenge yourself with this interactive quiz and see how well you understand the topic

❓
8
Questions
🎯
70%
To Pass
♾️
∞
Time
🔄
∞
Attempts

📝 Instructions

  • Read each question carefully
  • Select the best answer for each question
  • You can retake the quiz as many times as you want
  • Your progress will be shown at the top
Topic 19 of 22
Javascript Tutorial