Table of contents
Comparison Operators in JavaScript
JavaScript provides several comparison operators to compare values and evaluate logical expressions. These operators return either true or false based on the comparison result. Here's a breakdown of the most common ones:
Equality (==):
It returns true if the values are equal, even if they are of different types.
For example:
let a = 2;
let b = "2";
if (a == b) {
console.log(true);
}else{
console.log(false);
}
// Output: true
// Because == operator doesn't check the type strictly
Strict Equality (===):
It returns true only if the values are equal and the datatypes are also equal.
For example:
let a = 2;
let b = "2";
if (a === b) {
console.log(true);
}else{
console.log(false);
}
// Output: false
// Because === operator check the type strictly.
Inequality Operator (!=):
It returns true if the values are not equal, regardless of type.
For example:
let a = 3;
let b = "2";
if (a != b) {
console.log(true);
}else{
console.log(false);
}
// Output: true
Strict inequality (!==):
It returns true only if the values are not equal or of different types.
For example:
let a = 3;
let b = "2";
if (a !== b) {
console.log(true);
}else{
console.log(false);
}
// Output: true
Comparison:
Less than (<):
It returns true if the left operand is less than the right operand.
For example:
let a = 2;
let b = 3;
if (a < b) {
console.log(true);
}else{
console.log(false);
}
// Output: true // Because 2 isless than 3
Less than or equal to (<=):
It returns true if the left operand is less than or equal to the right operand.
For example:
let a = 3;
let b = 3;
if (a <= b) {
console.log(true);
}else{
console.log(false);
}
// Output: true // Because they are equal
Greater than (>):
It returns true if the left operand is greater than the right operand.
For example:
let a = 4;
let b = 3;
if (a > b) {
console.log(true);
}else{
console.log(false);
}
// Output: true
Greater than or equal to (>=):
It returns true if the left operand is greater than or equal to the right operand.
For example:
let a = 3;
let b = 2;
if (a >= b) {
console.log(true);
}else{
console.log(false);
}
// Output: true
Note 🎓:
When comparing strings, JavaScript converts them to numbers if possible. For example, '10' > 5 is true.
Comparison operators can be chained. For example, 1 < 2 < 3 is true.
The comparison operators are used in conditional statements like if and while to control program flow.
Logical Operators in JavaScript
JavaScript also offers a set of logical operators to combine multiple conditions and create more complex logical expressions. These operators help build conditional statements, control program flow and handle different situations based on various factors. Let's explore the main ones:
AND Operator (&&):
This operator returns true
only if both operands are true
. Otherwise, it returns false
.
Example:
let raining = true; // Operand 1
let cold = false; // Operand 2
if (raining && cold) {
console.log("Stay home, it's both rainy and cold!");
} else {
console.log("Both Conditions are not true!");
}
// Output: Both Conditions are not true!
OR Operator (||):
This operator returnstrue
if at least one operand is true
. It only returnsfalse
if both operands are false
.
Examples:
If one is true:
let money = false; // Operand 1
let card = true; // Operand 2
if (money || card) {
console.log("One is true so, You can buy that coffee!");
} else {
console.log("Better luck next time...");
}
// Output: One is true so, You can buy that coffee!
If both are true:
let money1 = true; // Operand 1
let card1 = true; // Operand 2
if (money || card) {
console.log("Both are true so, You can buy that coffee!");
} else {
console.log("Better luck next time...");
}
// Output: Both are true so, You can buy that coffee!
If both are false:
let hasMoney = false; // Operand 1
let hasCard = false; // Operand 2
if (hasMoney || hasCard) {
console.log("You can buy that coffee!");
} else {
console.log("Both Operands are false so, Better luck next time...");
}
// Output: Both Operands are false so, Better luck next time...
NOT (!):
This operator flips the logical value of its operand. true
becomesfalse
, and false
becomes true
.
Examples:
let isLoggedIn = false;
if (!isLoggedIn) {
console.log("You are LoggedIn!");
} else {
console.log("Go back!");
}
// Output: You are LoggedIn!
let isLoggedOut = true;
if (!isLoggedOut) {
console.log("You are LoggedOut!");
} else {
console.log("Go back!");
}
// Output: Go back!
Nullish Coalescing (??): Introduced in ES2020, this operator returns the first operand if it's not null
or undefined
. Otherwise, it returns the second operand.
Example:
let userName = null;
let defaultUserName = "Muhammad Bilal";
let actualUserName = userName ?? defaultUserName;
console.log(`Welcome, ${actualUserName}`);
// Output: Welcome, Muhammad Bilal