Logical operators in JavaScript are used to combine, evaluate, and reverse Boolean conditions. They are commonly used in decision-making statements, loops, form validation, authentication, and other situations where a program needs to check multiple conditions. JavaScript provides three main logical operators: AND (&&), OR (||), and NOT (!). These operators work with Boolean values and return a Boolean result in many common conditional expressions.

Table of Contents

---

What Are Logical Operators in JavaScript?

Logical operators are used to combine two or more conditions and determine whether those conditions are satisfied. They are especially useful when a program needs to make a decision based on multiple conditions.
For example, a program may need to check whether a student has passed both an examination and an assignment. The logical AND operator can be used to combine these conditions.

Syntax:

condition1 operator condition2

Types of Logical Operators

JavaScript provides three main logical operators:

Operator	Name	Description
&&	Logical AND	Returns true when both conditions are true.
`		`
!	Logical NOT	Reverses the Boolean value of a condition.

Logical AND (&&)

The logical AND operator && checks whether all specified conditions are true. The result is true only when both conditions are true.

Syntax:

condition1 && condition2

Example:

// JavaScript program to demonstrate the logical AND operator
let age = 20;
let hasLicense = true;
console.log(age >= 18 && hasLicense);

Output:

true

In this example, age >= 18 is true, and hasLicense is also true. Since both conditions are true, the logical AND operator returns true.

Logical AND Truth Table

The logical AND operator follows these rules:

Condition 1	Condition 2	Result
true	true	true
true	false	false
false	true	false
false	false	false

The AND operator returns true only when both conditions are true.

Logical OR (||)

The logical OR operator || checks whether at least one of the specified conditions is true. The result is false only when all conditions are false.

Syntax:

condition1 || condition2

Example:

// JavaScript program to demonstrate the logical OR operator
let hasEmail = false;
let hasPhone = true;
console.log(hasEmail || hasPhone);

Output:

true

In this example, hasEmail is false, but hasPhone is true. Since at least one condition is true, the logical OR operator returns true.

Logical OR Truth Table

The logical OR operator follows these rules:

Condition 1	Condition 2	Result
true	true	true
true	false	true
false	true	true
false	false	false

The OR operator returns true when at least one condition is true.

Logical NOT (!)

The logical NOT operator! reverses the Boolean value of a condition. If the condition is true, the NOT operator changes it to false. If the condition is false, it changes it to true.

Syntax:

!condition

Example:

// JavaScript program to demonstrate the logical NOT operator
let isLoggedIn = true;
console.log(!isLoggedIn);

Output:

false

The value of isLoggedIn is true. The! operator reverses it, so the result becomes false.

Logical NOT Truth Table

Condition	Result
true	false
false	true

Combining Multiple Logical Operators

JavaScript allows multiple logical operators to be combined in a single expression. Parentheses can be used to make the order of evaluation clear.

Example:

// JavaScript program to demonstrate multiple logical operators
let age = 22;
let hasId = true;
let isBlocked = false;
let canEnter = age >= 18 && hasId && !isBlocked;
console.log(canEnter);

Output:

true

Here, the program checks three conditions. The person must be at least 18 years old, must have an ID, and must not be blocked. Since all these conditions are satisfied, the result is true.

Logical Operators with if Statements

Logical operators are frequently used with if statements to make decisions based on multiple conditions.

Example:

// JavaScript program to demonstrate logical operators with an if statement
let username = "admin";
let password = "12345";
if (username === "admin" && password === "12345") {
    console.log("Login successful");
} else {
    console.log("Invalid username or password");
}

Output:

Login successful

The && operator ensures that both the username and password conditions must be true before the login is successful.

Logical Operators with Comparison Operators

Logical operators are often combined with comparison operators such as >, <, >=, <=, ==, and ===.

Example:

// JavaScript program to demonstrate logical and comparison operators
let marks = 75;
let attendance = 85;
if (marks >= 40 && attendance >= 75) {
    console.log("Student is eligible");
} else {
    console.log("Student is not eligible");
}

Output:

Student is eligible

The program checks both marks and attendance. The student is eligible only when both conditions are satisfied.

Short-Circuit Evaluation

JavaScript uses short-circuit evaluation with logical operators. This means JavaScript may stop evaluating an expression as soon as the final result is already known.

With the && operator, if the first condition is false, JavaScript does not need to evaluate the remaining conditions because the complete AND expression cannot become true.

With the || operator, if the first condition is true, JavaScript does not need to evaluate the remaining conditions because the complete OR expression is already known to be true.

Example:

// JavaScript program to demonstrate short-circuit evaluation
let age = 16;
age >= 18 && console.log("Eligible to vote");

In this example, age >= 18 is false, so the second expression is not executed.

Complete Program Using Logical Operators

The following program demonstrates the use of AND, OR, and NOT operators.

// JavaScript program to demonstrate all logical operators
let age = 21;
let hasTicket = true;
let isBanned = false;
let conditionAnd = age >= 18 && hasTicket;
let conditionOr = age >= 18 || hasTicket;
let conditionNot = !isBanned;
console.log("AND:", conditionAnd);
console.log("OR:", conditionOr);
console.log("NOT:", conditionNot);

Output:

AND: true
OR: true
NOT: true

Advantages of Logical Operators

1. Multiple Condition Checking: Logical operators allow a program to check multiple conditions together.
2. Decision Making: They help programs make decisions based on more than one condition.
3. Code Simplification: Logical operators can combine conditions into a single expression instead of using multiple separate statements.
4. Validation: They are useful for checking conditions such as age, marks, passwords, permissions, and user input.
5. Conditional Execution: Logical operators can determine whether specific statements should be executed.

Common Beginner Mistakes

1. Confusing && and ||: The && operator requires all conditions to be true, while the || operator requires at least one condition to be true.
2. Using & Instead of &&: The & operator is a bitwise AND operator, while && is the logical AND operator.
3. Using | Instead of ||: The | operator is a bitwise OR operator, while || is the logical OR operator.
4. Forgetting the NOT Operator: The ! operator reverses a Boolean condition, so adding it can change the result of an expression.
5. Ignoring Operator Precedence: When several logical and comparison operators are combined, parentheses should be used when necessary to make the intended order clear.

Conclusion

Logical operators are important JavaScript operators used to combine and evaluate multiple conditions. The logical AND operator && returns true when all required conditions are true, the logical OR operator || returns true when at least one condition is true, and the logical NOT operator! reverses a Boolean value. These operators are widely used with comparison operators, conditional statements, loops, validation, and decision-making programs.

FAQs

1. What are logical operators in JavaScript?

Logical operators are used to combine or reverse conditions. The main logical operators in JavaScript are &&, ||, and !.

2. What does the && operator do in JavaScript?

The && operator returns true when both conditions are true. If either condition is false, the result is false.

3. What does the || operator do in JavaScript?

The || operator returns true when at least one of the conditions is true. It returns false when all conditions are false.

4. What does the! operator do in JavaScript?

The ! operator reverses a Boolean value. It changes true to false and false to true.

5. Where are logical operators used in JavaScript?

Logical operators are commonly used in conditional statements, loops, validation, authentication, and situations where multiple conditions need to be checked.