Conditionals: if, else, and Decisions in Code

If-Else and Switch

Conditional Logic & Decision Making

By AI Learning Assistant  ·  JavaScript  ·  Control Flow  ·  Fundamentals

Programs need to make decisions. A script that simply runs line by line from top to bottom is rarely useful. You need the ability to check conditions, compare values, and execute different blocks of code based on what is happening at runtime. This is the domain of conditional statements.

Every application you use relies on conditional logic. When you log in, the system checks if your password matches. When you add an item to your cart, it checks if the item is in stock. When you submit a form, it validates every field. None of this happens without if statements, comparisons, and logical branching.

JavaScript gives you three primary tools for branching: if...else chains for flexible logic, switch for discrete value matching, and the ternary operator for concise binary choices. We will also cover the comparison and logical operators that power every condition, the tricky world of truthy and falsy values, and modern alternatives like lookup objects.

At each stage, we will use AI to clarify the subtle rules that separate working conditions from expert level logic.

The if statement evaluates a condition inside parentheses. If that condition converts to true, the code block inside the curly braces runs. If it converts to false, the block is skipped entirely. The condition does not need to be a literal boolean; JavaScript will coerce the value internally.

The coercion mechanism is both powerful and dangerous. A string containing text is truthy. An empty string is falsy. The number zero is falsy, but the string "0" is truthy. An empty array is truthy. Understanding these distinctions prevents silent bugs that can take hours to debug.

When you need to choose between two paths, use else. When you have three or more possibilities, chain else if blocks. Only one block in the entire chain will ever execute. As soon as a condition is met, JavaScript runs that block and skips everything else below it.

This exclusivity is critical. If you check whether a score is passing and then separately check whether it is excellent, a score of 85 could trigger both blocks unless you structure them as an if-else-if chain. The first matching condition always wins, and the rest are ignored.

JavaScript offers two equality operators. === is strict equality: it checks both value and type, and never performs coercion. == is loose equality: it attempts to convert types before comparing, which leads to famously confusing results. The professional standard is to always use === and !==.

Loose equality has a complex set of rules. A number compared to a string converts the string to a number. A boolean compared to anything converts the boolean to a number first. Null and undefined are equal to each other but nothing else. These rules are so unpredictable that most style guides and linters forbid == entirely.

You can combine conditions using && (AND), || (OR), and ! (NOT). && requires both sides to be truthy. || requires at least one side to be truthy. ! inverts a boolean.

Logical operators use short circuit evaluation. For &&, if the left side is falsy, the right side is never evaluated. For ||, if the left side is truthy, the right side is skipped. This behavior is exploited for default values and guard patterns.

Short circuit evaluation is not just an optimization. It is a pattern. You can use user && user.name to safely access a property only if the user exists. You can use config.timeout || 5000 to provide a default value when a setting is missing. These patterns are everywhere in professional JavaScript.

The conditional operator is JavaScript's only ternary operator. It takes three operands: a condition, a value if true, and a value if false. Unlike if...else, the ternary operator is an expression, meaning it returns a value and can be used inside variable assignments, template literals, and return statements.

This distinction between statements and expressions is fundamental. A statement performs an action. An expression produces a value. You cannot put a statement where JavaScript expects an expression, which is why you cannot use if...else inside a template literal but you can use a ternary.

A switch statement evaluates an expression once, then attempts to match the result against a series of case labels using strict equality (===). When a match is found, execution begins at that case and continues through subsequent cases until a break is encountered. This behavior is called fall through.

Fall through can be useful for grouping cases. For example, you might want the same code to run for both "Saturday" and "Sunday". But forgetting break is one of the most common switch statement bugs in production code. The default case runs when no match is found, acting like the final else in an if chain.

In JavaScript, every value is either truthy or falsy when evaluated as a boolean. There are exactly six falsy values: false, 0, "" (empty string), null, undefined, and NaN. Everything else, including empty arrays, empty objects, and the string "0", is truthy.

This is a common source of confusion. A function that checks if (count) will skip the block when count is zero, even though zero is a perfectly valid number. To handle this, you must explicitly check for null or undefined rather than relying on truthiness when zero is a legitimate value.

In modern JavaScript, object lookup maps and Map structures often replace switch statements entirely. Instead of a switch on status codes, you can define a plain object where keys are the cases and values are the results. This is easier to test, easier to extend, and eliminates the risk of forgotten breaks.

The Map version is even more powerful because Map keys can be any type, not just strings. You can use objects, functions, or NaN as keys. Maps also preserve insertion order and have a clean API for checking existence and iterating entries.

Quick Comparison