JavaScript Comparison Operators

Compare values and make decisions in your code

⚖️ What are Comparison Operators?

Comparison operators are used to compare two values and return a boolean result (true or false). They're essential for making decisions in your programs! 


// Basic comparisons
let age = 18;
let isAdult = age >= 18;        // true
let isChild = age < 13;         // false
let canVote = age === 18;       // true

Output:

isAdult = true

isChild = false

canVote = true

Types of Comparison Operators

==

Equal To

Checks if values are equal 

5 == "5" // true
===

Strict Equal

Checks value and type equality 

5 === "5" // false
!=

Not Equal

Checks if values are not equal 

5 != 3 // true
!==

Strict Not Equal

Checks value and type inequality 

5 !== "5" // true

🔹 Equality Operators (== vs ===)

Understanding the difference between loose and strict equality: 

// Loose equality (==) - converts types
console.log(5 == "5");        // true (string "5" converted to number)
console.log(true == 1);       // true (true converted to 1)
console.log(false == 0);      // true (false converted to 0)
console.log(null == undefined); // true (special case)

// Strict equality (===) - no type conversion
console.log(5 === "5");       // false (different types)
console.log(true === 1);      // false (different types)
console.log(false === 0);     // false (different types)
console.log(null === undefined); // false (different types)

// Best practice: Use === for safer comparisons
let userAge = "25";
if (userAge === 25) {
    console.log("This won't run - different types");
}
if (userAge === "25") {
    console.log("This will run - same type and value");
}

Console Output:

true

true

true

true

false

false

false

false

This will run - same type and value

🔹 Relational Operators

Compare the relative values of numbers and strings: 

// Greater than (>)
console.log(10 > 5);          // true
console.log(3 > 8);           // false

// Less than (<)
console.log(4 < 7);           // true
console.log(9 < 2);           // false

// Greater than or equal (>=)
console.log(15 >= 15);        // true
console.log(12 >= 20);        // false

// Less than or equal (<=)
console.log(8 <= 10);         // true
console.log(25 <= 15);        // false

// String comparison (alphabetical order)
console.log("apple" < "banana");  // true
console.log("zebra" > "ant");     // true
console.log("Cat" < "cat");       // true (uppercase comes first)

Console Output:

true

false

true

false

true

false

true

false

true

true

true

🔹 Practical Examples with If Statements

Using comparison operators to make decisions: 

// Age verification system
let userAge = 17;

if (userAge >= 18) {
    console.log("You can vote!");
} else if (userAge >= 16) {
    console.log("You can drive!");
} else if (userAge >= 13) {
    console.log("You're a teenager!");
} else {
    console.log("You're a child!");
}

// Password strength checker
let password = "mypassword123";

if (password.length >= 12) {
    console.log("Strong password");
} else if (password.length >= 8) {
    console.log("Medium password");
} else {
    console.log("Weak password");
}

// Grade calculator
let score = 85;
let grade;

if (score >= 90) {
    grade = "A";
} else if (score >= 80) {
    grade = "B";
} else if (score >= 70) {
    grade = "C";
} else if (score >= 60) {
    grade = "D";
} else {
    grade = "F";
}

console.log("Your grade is: " + grade);

Console Output:

You can drive!

Medium password

Your grade is: B

🔹 Common Pitfalls and Tips

Avoid these common mistakes when using comparison operators: 

// Pitfall 1: Assignment vs Comparison
let x = 5;
// Wrong: if (x = 10) - This assigns 10 to x!
// Correct: if (x == 10) - This compares x with 10

if (x === 5) {
    console.log("x is 5");
}

// Pitfall 2: Comparing different types
let userInput = "20";  // String from form input
let minimumAge = 18;   // Number

// Wrong way (might work but unpredictable)
if (userInput > minimumAge) {
    console.log("Old enough");
}

// Better way (convert to same type first)
if (Number(userInput) > minimumAge) {
    console.log("Old enough - converted to number");
}

// Pitfall 3: Floating point precision
let price1 = 0.1 + 0.2;  // 0.30000000000000004
let price2 = 0.3;

console.log(price1 === price2);  // false!
console.log(Math.abs(price1 - price2) < 0.001);  // true (better way)

Console Output:

x is 5

Old enough - converted to number

false

true

🧠 Test Your Knowledge

What is the result of: "10" === 10?