Comparison Operators
Comparison operators are used to compare values.
Every comparison produces a boolean result:
true;
false;You will use comparison operators in conditions, validation, loops, filtering, sorting, and decision-making logic.
const age = 20;
if (age >= 18) {
console.log("Adult");
}Core Comparison Operators
JavaScript has four main relational comparison operators.
| Operator | Meaning | Example | Result |
|---|---|---|---|
> |
Greater than | 10 > 5 |
true |
< |
Less than | 10 < 5 |
false |
>= |
Greater than or equal to | 5 >= 5 |
true |
<= |
Less than or equal to | 4 <= 5 |
true |
These operators are sometimes called relational operators because they check the relationship between two values.
Comparing Numbers
Number comparisons behave like normal math.
console.log(10 > 5); // true
console.log(10 < 5); // false
console.log(5 >= 5); // true
console.log(4 <= 5); // truePractical example:
const cartTotal = 1200;
const freeShippingMinimum = 999;
if (cartTotal >= freeShippingMinimum) {
console.log("Free shipping applied");
}Comparing Strings
When both values are strings, JavaScript compares them lexicographically.
That means it compares characters from left to right based on their character codes.
console.log("b" > "a"); // true
console.log("apple" < "banana"); // trueThis is similar to alphabetical order, but not exactly the same as dictionary sorting in every language or locale.
The Numeric String Trap
String comparison is not numeric comparison.
console.log("10" < "2"); // trueThis looks wrong if you think of them as numbers.
But JavaScript is comparing strings:
- First character of
"10"is"1". - First character of
"2"is"2". "1"comes before"2".
So "10" < "2" is true.
If you want numeric comparison, convert first:
const a = Number("10");
const b = Number("2");
console.log(a < b); // falseComparing Different Types
When comparing a string and a number with relational operators, JavaScript usually tries to convert the string to a number.
console.log("10" > 2); // true
console.log("5" < 10); // trueIn the first example:
"10" > 2becomes roughly:
10 > 2If the string cannot become a valid number, the result involves NaN.
console.log("hello" > 5); // false
console.log("hello" < 5); // false
console.log("hello" >= 5); // false
console.log("hello" <= 5); // false"hello" becomes NaN, and comparisons with NaN are false.
Comparing with NaN
Any relational comparison with NaN is false.
console.log(NaN > 1); // false
console.log(NaN < 1); // false
console.log(NaN >= 1); // false
console.log(NaN <= 1); // falseThis is why you should validate numeric input before comparing it.
const input = "hello";
const value = Number(input);
if (Number.isNaN(value)) {
console.log("Please enter a valid number");
} else if (value > 10) {
console.log("Value is greater than 10");
}Comparing Booleans
When booleans are compared with numbers, JavaScript can coerce them.
console.log(true > false); // true
console.log(true > 0); // true
console.log(false < 1); // trueThis happens because:
Number(true); // 1
Number(false); // 0Even though this works, it is usually clearer to compare booleans directly in conditions.
const isLoggedIn = true;
if (isLoggedIn) {
console.log("Welcome");
}Comparing null and undefined
Relational comparisons with null and undefined can be confusing.
console.log(null >= 0); // true
console.log(null > 0); // false
console.log(null == 0); // falseThis happens because relational comparison and equality comparison follow different coercion rules.
undefined usually becomes NaN in numeric comparison:
console.log(undefined > 0); // false
console.log(undefined < 0); // false
console.log(undefined >= 0); // falseBest practice: avoid relational comparisons with null and undefined. Check for missing values first.
if (value == null) {
console.log("Value is missing");
} else if (value > 10) {
console.log("Value is greater than 10");
}Comparing Objects and Arrays
Objects and arrays are reference types.
Relational comparisons with them can trigger conversion to primitive values, often strings.
console.log([1, 2] > [1, 1]); // trueThis happens because arrays can convert to strings:
String([1, 2]); // "1,2"
String([1, 1]); // "1,1"Then JavaScript compares the strings.
Objects are even less useful in relational comparisons:
console.log({} > {}); // false
console.log({} < {}); // falseAvoid using <, >, <=, or >= directly with objects and arrays unless you intentionally control how conversion works.
Compare specific properties instead:
const userA = { age: 25 };
const userB = { age: 30 };
console.log(userA.age < userB.age); // trueCombining Comparisons with Logical Operators
Comparisons are often combined with logical operators.
const age = 25;
const hasTicket = true;
if (age >= 18 && hasTicket) {
console.log("Entry allowed");
}Another example:
const score = 82;
if (score >= 80 && score <= 100) {
console.log("Valid high score");
}This checks whether score is inside a range.
Common Mistakes
Comparing Numeric Strings as Strings
console.log("10" < "2"); // trueConvert to numbers first:
console.log(Number("10") < Number("2")); // falseAssuming Comparisons with NaN Work
console.log(NaN > 0); // false
console.log(NaN <= 0); // falseUse Number.isNaN() to detect invalid numbers.
Comparing Whole Objects
const productA = { price: 100 };
const productB = { price: 200 };
console.log(productA < productB); // Not usefulCompare the property you care about:
console.log(productA.price < productB.price); // trueBest Practices
- Compare numbers with numbers.
- Convert numeric strings before numeric comparison.
- Be careful with string comparisons because they are lexicographical.
- Validate values before comparing if they may become
NaN. - Avoid relational comparisons with objects and arrays.
- Compare object properties instead of whole objects.
- Use parentheses when combining comparisons with logical operators.
Summary
Comparison operators compare values and return booleans.
Remember:
>,<,>=, and<=are relational comparison operators.- Number comparisons behave like normal math.
- String comparisons are lexicographical.
"10" < "2"istruebecause both values are strings.- String-number comparisons can trigger numeric coercion.
- Any comparison with
NaNis false. - Avoid relational comparisons with objects and arrays.
Next, you will learn about equality operators, where JavaScript's strict and loose comparison rules become especially important.