HOWTO · JavaScript
How to Specify Multiple Conditions Inside the if Statement in JavaScript
Learn how to combine multiple conditions in a JavaScript if statement.
On this page
In JavaScript, put each condition inside the parentheses of an if statement. Join conditions with && when every condition must be true, or with || when at least one may be true. Use parentheses to make mixed logic clear, and use an if...else if chain when different matches need different actions.
Combine conditions with && and || in a JavaScript if statement
In an if condition, && requires both operands to be truthy, while || requires at least one operand to be truthy. JavaScript logical operators return one of their operand values, which is not necessarily a boolean; the if statement then tests that result for truthiness. For example, age >= 18 && hasTicket allows an action only when a person is an adult and has a ticket. If either condition is falsy, the combined condition is falsy.
For example, isAdmin || isOwner allows an action when the user is an administrator or owns the item. Choose the operator based on the rule you need: “all of these” calls for &&; “any of these” calls for ||.
In this example, the first check accepts only an adult with a ticket. The second check accepts a user who is either an administrator or the item owner.
Run this example:
const visitors = [
{ name: "Ava", age: 20, hasTicket: true, isAdmin: false, isOwner: false },
{ name: "Ben", age: 16, hasTicket: true, isAdmin: false, isOwner: true },
{ name: "Cy", age: 30, hasTicket: false, isAdmin: true, isOwner: false }
];
for (const visitor of visitors) {
if (visitor.age >= 18 && visitor.hasTicket) {
console.log(`${visitor.name}: entry allowed`);
}
if (visitor.isAdmin || visitor.isOwner) {
console.log(`${visitor.name}: can manage the item`);
}
}
Ava: entry allowed
Ben: can manage the item
Cy: can manage the item
The conditions use boolean properties and a numeric comparison, so each part can be read independently before the operator combines the results. In a real program, replace the sample values with values from your application.
Combine && and || safely with grouping and precedence
You can combine the operators in one condition. JavaScript evaluates && before ||, so isMember || hasCoupon && cartTotal >= 50 means isMember || (hasCoupon && cartTotal >= 50). It allows every member, or a non-member with a coupon and a cart total of at least 50.
Add parentheses whenever the rule should be grouped differently or when they make the intended rule easier to scan. For instance, (isMember || hasCoupon) && cartTotal >= 50 requires the minimum total for both members and coupon holders. Those two expressions are not equivalent. See the MDN operator precedence reference for the precedence of JavaScript operators.
Use strict equality, such as status === "ready", when comparing a value to a specific number or string. This avoids the type conversion performed by loose equality (==). Logical operators also short-circuit: && does not evaluate its right operand when the left operand is false, and || skips its right operand when the left operand is true. This can be useful for guarded checks, such as user !== null && user !== undefined && user.active.
Use if…else if when conditions need different actions
A single if condition combines checks for one action. When a value should select among several different actions, write an if...else if...else chain. JavaScript tests the branches in order, runs the first branch whose condition is true, and skips the rest of that chain. The final else is optional and handles values that did not match any earlier condition.
For example, a score can be classified into bands with conditions such as score >= 90, score >= 70, and score >= 50. Check the highest band first: a score of 95 satisfies all three comparisons, but the chain runs only the first matching branch. The following example assigns a different action label for each band:
const score = 95;
let action;
if (score >= 90) {
action = "excellent";
} else if (score >= 70) {
action = "pass";
} else if (score >= 50) {
action = "review";
} else {
action = "retry";
}
With score set to 95, action becomes "excellent". Although the score also meets the lower thresholds, JavaScript skips the remaining branches after the first match. If you used separate if statements instead, several actions could run for the same score.
Keep each branch’s condition and action aligned. For example, the score >= 70 branch covers scores from 70 up to (but not including) 90 because the higher band is checked first. For exact values, use ===; for a range checked directly, combine comparisons with &&, such as score >= 70 && score < 90.