Operators In JavaScript: Comparison and Logical Operators In JavaScript

Operators In JavaScript: Comparison and Logical Operators In JavaScript

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