Skip to main content

How to Specify Multiple Conditions in a JavaScript if Statement

In programming, you often need to check multiple conditions at once to make a decision. JavaScript provides two fundamental logical operators, && (AND) and || (OR), that allow you to combine multiple conditions within a single if statement.

This guide will teach you how to use the logical AND and OR operators to build complex conditional logic, and how to combine them for more advanced scenarios.

The Core Operators: && (AND) and || (OR)​

  • && (Logical AND): The if block will only execute if all of the conditions are true.
  • || (Logical OR): The if block will execute if at least one of the conditions is true.

Using the Logical AND (&&) Operator​

Use the && operator when you need to ensure that multiple criteria are all met simultaneously.

Problem: you want to run a piece of code only if a user is both logged in and is an administrator.

Solution:

let isLoggedIn = true;
let userRole = 'admin';

if (isLoggedIn && userRole === 'admin') {
  console.log('Access granted: Welcome, Admin!');
} else {
  console.log('Access denied.');
}

Output:

Access granted: Welcome, Admin!
note

If you change userRole to 'user', the first condition (isLoggedIn) is still true, but the second (userRole === 'admin') becomes false. Since && requires all conditions to be true, the else block would run instead.

Using the Logical OR (||) Operator​

Use the || operator when you need to run a piece of code if any one of several possible conditions is met.

Problem: you want to grant access to a resource if a user is either an "admin" or a "moderator".

Solution:

let userRole = 'moderator';

if (userRole === 'admin' || userRole === 'moderator') {
  console.log('Access granted: You have elevated privileges.');
} else {
  console.log('Access denied.');
}
// Output: Access granted: You have elevated privileges.

Output:

Access granted: You have elevated privileges.
note

Here, the first condition (userRole === 'admin') is false, but the second condition (userRole === 'moderator') is true. Since || only requires at least one condition to be true, the if block executes.

Combining && and || in a Single Statement​

You can combine both operators to create more complex rules. When you do, it's a crucial best practice to use parentheses () to group your conditions for clarity and to ensure they are evaluated in the correct order.

Problem: you want to send a notification if a user is an "admin" or if a user is a "manager" in the "sales" department.

Solution:

let userRole = 'manager';
let userDepartment = 'sales';

// Use parentheses to group the 'manager' and 'sales' check
if (userRole === 'admin' || (userRole === 'manager' && userDepartment === 'sales')) {
  console.log('Sending notification...');
} else {
  console.log('No notification needed.');
}

Output:

Sending notification...

In this example:

  1. The && condition inside the parentheses is evaluated first: ('manager' === 'manager' && 'sales' === 'sales') becomes true.
  2. The || condition is then evaluated: ('manager' === 'admin' || true) becomes true.
  3. The if block runs.

Without the parentheses, the code would still work in this specific case due to operator precedence (&& is evaluated before ||), but it is much harder to read and more prone to bugs. Always use parentheses to make your logic explicit.

Conclusion​

Using multiple conditions in an if statement is a fundamental part of programming logic.

  • Use the && (AND) operator when all conditions must be true.
  • Use the || (OR) operator when at least one condition must be true.
  • When combining && and ||, always use parentheses () to group your conditions to ensure your logic is clear, readable, and evaluated correctly.

Table of Contents