Comparison Operators

Comparison operators in JavaScript are tools for checking how two values relate to each other. Think of them as the math symbols you’re familiar with, but used in code to decide if values are equal, greater, or lesser. Every time you use one, the result is either true or false, giving your code the power to make decisions.

== (Equal to)

This operator checks if two values are the same after converting them to a common type. It’s like JavaScript’s way of saying, “Let’s make these values compatible before comparing.” But be careful—automatic type conversion can sometimes lead to unexpected results. For example, 5 == "5" returns true because JavaScript converts the string "5" to the number 5 before comparing.

=== (Strictly equal to)

This is the stricter sibling of ==. It checks if two values are exactly the same without any type conversion. It’s the safer choice to avoid bugs. For example, 5 === "5" returns false because one is a number and the other is a string, and JavaScript won’t try to force them to match.

!= (Not equal to)

This operator checks if two values are different, with type conversion. It’s flexible, but like ==, can be tricky. For instance, 5 != "5" returns false because after conversion, the values are considered the same.

!== (Strictly not equal to)

The strict version of !=, this operator checks if two values are different without converting types. It’s usually better to use this to avoid confusion. For example, 5 !== "5" returns true because one is a number and the other is a string.

When comparing numbers:

< (Less than)

This checks if the first value is smaller than the second. For example, 3 < 8 returns true.

> (Greater than)

This checks if the first value is larger than the second. For example, 7 > 5 returns true.

<= (Less than or equal to)

This checks if the first value is smaller than or equal to the second. For example, 4 <= 4 returns true.

>= (Greater than or equal to)

This checks if the first value is larger than or equal to the second. For example, 5 >= 5 returns true.

// < (Less than)
console.log(3 < 8); // Output: true
console.log(10 < 5); // Output: false

// > (Greater than)
console.log(7 > 5); // Output: true
console.log(2 > 9); // Output: false

// <= (Less than or equal to)
console.log(4 <= 4); // Output: true
console.log(3 <= 5); // Output: true
console.log(6 <= 5); // Output: false

// >= (Greater than or equal to)
console.log(5 >= 5); // Output: true
console.log(8 >= 6); // Output: true
console.log(4 >= 7); // Output: false

Understanding these comparison operators is crucial when building applications that need to make decisions, like checking if a user’s input meets certain criteria.

String Comparisons

JavaScript comparison operators behave a bit differently with strings and numbers. The + operator, for instance, tends to favor strings—if one operand is a string, it will concatenate rather than add. However, the comparison operators typically favor numbers and only compare strings if both operands are strings.

When comparing strings:

JavaScript compares them as sequences of 16-bit integer values, essentially doing a numerical comparison of the characters. Keep in mind that string comparison is case-sensitive—capital letters are considered "less than" lowercase letters. For example, "Apple" < "banana" returns true because uppercase letters are less than lowercase letters in terms of value.

If you need a case-insensitive comparison, you can convert the strings to all lowercase or all uppercase using String.toLowerCase() or String.toUpperCase() before comparing.

But don’t stress too much about string comparisons—they’re not commonly used and can be confusing. Many developers, myself included, rarely use them in practice.

// Case-sensitive comparison
console.log("Apple" < "banana"); // Output: true (because "A" < "b")

// Case-insensitive comparison
let str1 = "Apple".toLowerCase(); // Convert to lowercase
let str2 = "banana".toLowerCase(); // Convert to lowercase
console.log(str1 < str2); // Output: true (after conversion, "apple" < "banana")

// Case-insensitive comparison with uppercase
let str3 = "Apple".toUpperCase(); // Convert to uppercase
let str4 = "BANANA".toUpperCase(); // Convert to uppercase
console.log(str3 < str4); // Output: true (after conversion, "APPLE" < "BANANA")

// Example using <= and >= operators
console.log("Apple" <= "banana"); // Output: true
console.log("Apple" >= "banana"); // Output: false

Lastly, remember that the <= and >= operators aren’t reliant on the equality (==) or strict equality (===) operators. Instead, they are defined as “not greater than” and “not less than,” respectively, making them straightforward tools for comparison in your code.

Study Style Notes

Comparison Operators in JavaScript

Purpose: Comparison operators are tools for checking how two values relate to each other. Think of them as the math symbols you’re familiar with, but used in code to decide if values are equal, greater, or lesser.
Result: Every time you use a comparison operator, the result is either true or false, giving your code the power to make decisions.

Equality Operators

== (Equal to):
- Checks if two values are the same after converting them to a common type.
- Example: 5 == "5" returns true because JavaScript converts the string "5" to the number 5 before comparing.
- Note: Be careful—automatic type conversion can sometimes lead to unexpected results.
=== (Strictly equal to):
- Checks if two values are exactly the same without any type conversion.
- Example: 5 === "5" returns false because one is a number and the other is a string.
- Recommendation: It’s the safer choice to avoid bugs by preventing type coercion.
!= (Not equal to):
- Checks if two values are different, with type conversion.
- Example: 5 != "5" returns false because after conversion, the values are considered the same.
- Caution: This operator is flexible but can be tricky due to type conversion.
!== (Strictly not equal to):
- Checks if two values are different without converting types.
- Example: 5 !== "5" returns true because one is a number and the other is a string.
- Recommendation: It’s usually better to use this to avoid confusion.

Numerical Comparisons

< (Less than):
- Checks if the first value is smaller than the second.
- Example: 3 < 8 returns true.
> (Greater than):
- Checks if the first value is larger than the second.
- Example: 7 > 5 returns true.
<= (Less than or equal to):
- Checks if the first value is smaller than or equal to the second.
- Example: 4 <= 4 returns true.
>= (Greater than or equal to):
- Checks if the first value is larger than or equal to the second.
- Example: 5 >= 5 returns true.
Understanding Comparisons: These operators are crucial when building applications that need to make decisions, like checking if a user’s input meets certain criteria.

String Comparisons

Behavior with Strings and Numbers:
- The + operator favors strings—if one operand is a string, it concatenates rather than adds.
- The comparison operators typically favor numbers and only compare strings if both operands are strings.
How Strings are Compared:
- JavaScript compares them as sequences of 16-bit integer values, essentially performing a numerical comparison of the characters.
- Case-Sensitive: String comparison is case-sensitive; capital letters are considered "less than" lowercase letters.
- Example: "Apple" < "banana" returns true because uppercase letters are less than lowercase letters in terms of value.
Case-Insensitive Comparison:
- Convert the strings to all lowercase or all uppercase using String.toLowerCase() or String.toUpperCase() before comparing.
- Note: Don’t stress too much about string comparisons—they’re not commonly used and can be confusing.

Understanding the `<=` and `>=` Operators

<= and >=: These operators aren’t reliant on the equality (==) or strict equality (===) operators. They are defined as “not greater than” and “not less than,” respectively, making them straightforward tools for comparison in your code.

Type Conversions

Logical Expressions