Combining Conditions with &&, ||, and !

Welcome back! We have compared values and seen that each comparison gives us a boolean answer: true or false. Real questions often depend on more than one fact, such as whether the shop is open and whether it has any stock.

In this lesson, we will combine boolean answers with &&, ||, and !. We will store the resulting conditions under meaningful names and report them with template literals. This is the last unit in this course, so we will finish with a small decision report that uses the ideas we have built so far.

The operator && combines two conditions. Its result is true only when both sides are true. Suppose the shop can serve customers only if it has stock and is open:

const stockCount = 4;
const isOpen = true;
console.log(stockCount > 0 && isOpen);
console.log(stockCount === 0 && isOpen);

The first condition has two true sides. In the second, stock is not zero, so one side is false even though the shop is open:

true
false

We can read the first condition as “stock is above zero and the shop is open.” In this lesson, we combine boolean conditions, so each side gives a true or false answer and the combined result is boolean too.

The operator || combines conditions when either one is enough. Its result is true when at least one side is true, and false only when both sides are false:

const stockCount = 4;
const isHappyHour = false;
console.log(stockCount > 100 || isHappyHour);

The stock is not greater than 100, and happy hour is false, so neither condition holds. The output is:

false

If we changed isHappyHour to true, the result would be true even though the stock condition remains false. For these examples, both sides are boolean conditions, and either one may make the combined condition true.

The operator ! flips a boolean: it turns true into false and false into true. We place it directly before the value or condition we want to flip:

const isOpen = true;
const stockCount = 0;
console.log(isOpen);
console.log(!isOpen);
console.log(!(stockCount > 0));

The first two lines show a stored answer and its opposite. The final line flips the complete comparison in parentheses: stock is not above zero, so its opposite is true.

true
false
true

Parentheses make clear which comparison ! flips. This is useful whenever we need the opposite of a state or a complete yes-or-no question.

We can store combined conditions in const variables and use their names in a report. At an event gate, we may need both a ticket and an open gate to admit someone:

const ticketsLeft = 4;
const isGateOpen = true;
const canEnter = ticketsLeft > 0 && isGateOpen;
const pauseEntry = ticketsLeft < 2 || !isGateOpen;

console.log(`Can enter right now: ${canEnter}`);
console.log(`Pause entry: ${pauseEntry}`);

The gate is open and tickets remain, so canEnter is true. Four tickets are not below two and the gate is not closed, so pauseEntry is false:

Can enter right now: true
Pause entry: false

These names let us understand each rule without reading every symbol again. The following practice applies the same operators to a shop with different conditions and report labels.

When a condition has several parts, we can check each smaller answer and then combine them. A short truth table shows how && and || behave:

| First answer | Second answer | With && | With || | | --- | --- | --- | --- | | true | true | true | true | | true | false | false | true | | false | true | false | true | | false | false | false | false |

The table lists all four pairs of boolean answers. We can read across a row to predict the combined result: && needs both answers to be true, while || needs at least one. We can use it to check a condition before running the program.

In everyday conversation, “either” can sometimes suggest exactly one choice. In a JavaScript condition, || means one or both sides are true; the first row shows that both true answers still produce true. When we translate a rule into code, we can listen for words such as “both” and “at least one” to choose between && and ||.

Clear variable names also help us read a longer condition. In ticketsLeft > 0 && isGateOpen, the first part is a comparison and the second is a boolean variable. We store the complete answer in canEnter, which names its purpose. Similarly, pauseEntry names the low-ticket-or-closed-gate condition. A clear name preserves the rule when we use the result again.

We learned to combine conditions with && when both sides must be true, with || when at least one side can be true, and with ! to flip a boolean answer. We can store those combined results under clear names and include them in a report.

That completes this course. We can now inspect types, convert values, compare them, and combine the resulting answers. In the next course, we will use conditions to choose what a program does and loops to repeat work. For now, let's practise combining a few checks of our own!