JavaScript Operators and Conditionals: Making Decisions in Code

So far your code can store values, but it can’t really do much with them or make any choices. This article fixes that. Operators are the symbols that let you calculate and compare values, and conditionals are how your code makes decisions — taking one path when something is true and a different path when it isn’t. Together, they’re where your programs start to feel genuinely smart.

For a lot of people, this is the moment programming finally clicks: the realization that you can write code that thinks — “if this, do that; otherwise, do something else.” Let’s build it up step by step.

Arithmetic operators: doing math

You’ve seen a couple of these already. The arithmetic operators do exactly what you’d expect:

const sum = 10 + 5;      // 15  (addition)
const diff = 10 - 5;     // 5   (subtraction)
const product = 10 * 5;  // 50  (multiplication)
const quotient = 10 / 5; // 2   (division)
const remainder = 10 % 3; // 1  (modulo — the remainder)

Most of these are obvious, but the last one deserves a note. The % operator, called modulo, gives the remainder after division. 10 % 3 is 1, because 3 goes into 10 three times with 1 left over. It turns out to be surprisingly useful — for instance, number % 2 === 0 is the standard way to check whether a number is even (an even number leaves no remainder when divided by 2).

There are also handy shortcuts for changing a variable by an amount:

let count = 5;
count += 1;   // same as count = count + 1  → 6
count -= 2;   // same as count = count - 2  → 4
count++;      // adds 1  → 5

count++ is an especially common one — it bumps a variable up by 1, something you’ll reach for constantly whenever you’re counting things.

Comparison operators: asking questions

Comparison operators compare two values and give back a boolean (true or false). These are the questions your conditionals will ask:

Each of these produces true or false, which is exactly what a conditional needs to make a decision.

The if statement: doing something conditionally

The if statement runs a block of code only if a condition is true:

const age = 20;

if (age >= 18) {
  console.log("You are an adult.");
}

The shape is if (condition) { code }. The condition goes in the parentheses, and if it evaluates to true, the code inside the curly braces runs. If it’s false, that code is skipped entirely. Here age is 20 (which is >= 18), so the message prints.

else and else if: handling the alternatives

An if on its own only handles the “true” case. To do something when the condition is false, add an else:

const age = 15;

if (age >= 18) {
  console.log("You are an adult.");
} else {
  console.log("You are a minor.");
}

Now exactly one of the two messages runs, depending on the age. And when you have more than two possibilities, you chain them with else if:

const score = 75;

if (score >= 90) {
  console.log("Grade: A");
} else if (score >= 80) {
  console.log("Grade: B");
} else if (score >= 70) {
  console.log("Grade: C");
} else {
  console.log("Grade: F");
}

JavaScript checks each condition from top to bottom, runs the first one that’s true, and skips the rest. Since score is 75, it fails the first two checks, passes score >= 70, prints “Grade: C”, and stops there. The final else is the catch-all for anything that didn’t match. This if/else if/else pattern is one of the most common structures in all of programming.

Logical operators: combining conditions

Sometimes a decision depends on more than one thing. Logical operators let you combine conditions:

• && (AND) — true only if both sides are true.
• || (OR) — true if either side is true.
• ! (NOT) — flips true to false and vice versa.

const age = 25;
const hasTicket = true;

if (age >= 18 && hasTicket) {
  console.log("You may enter.");
}

This runs only if age >= 18 and hasTicket is true — both have to hold. Swap && for || and it would run if either one were true. These operators are how you express real-world rules: “if the user is logged in AND has permission,” or “if it’s a weekend OR a holiday.”

The ternary operator: a compact shortcut

For simple if/else decisions there’s a shorthand called the ternary operator. It’s handy when you just want to pick between two values based on a condition:

const age = 20;
const message = age >= 18 ? "Adult" : "Minor";
console.log(message);   // "Adult"

Read it as: condition ? value if true : value if false. So age >= 18 ? "Adult" : "Minor" gives "Adult" because the condition is true. It does the same job as a small if/else, just on a single line. Reach for it on simple either/or choices; for anything more involved, a regular if/else reads more clearly.

Wrapping up

Your code can now calculate, compare, and decide:

• Arithmetic operators (+, -, *, /, %) do math; % (modulo) gives the remainder. Shortcuts like += and ++ change variables compactly.
• Comparison operators (===, !==, >, <, >=, <=) compare values and produce a boolean. Always use ===, not ==.
• if runs code when a condition is true; else handles the false case; else if chains multiple possibilities.
• Logical operators && (and), || (or), and ! (not) combine conditions.
• The ternary operator (condition ? a : b) is a one-line shortcut for simple if/else choices.

With conditionals in hand, your programs can finally take different actions in different situations — the very essence of logic. Next up, we’ll see how to package code into reusable, named blocks you can run whenever you want: functions, one of the most important concepts in all of programming.