JS Conditionals

Think of a border crossing checkpoint, if you have a valid passport, you're waved through, if not, you're directed to a different line, the outcome always depends on checking a specific condition first. Conditionals in JavaScript work the same way, they let your code check whether something is true and run different instructions depending on the answer, using if, else if, and else. Nearly every interactive feature relies on conditionals somewhere, whether it's checking login status or showing a personalized message on cookiescursor.com.

In this page:

The if Statement
else
else if
Nested if Statements
Ternary Operator and Short Circuit Evaluation

Syntax

javascript

if (condition1) {
  // code
} else if (condition2) {
  // code
} else {
  // code
}

The if Statement

An if statement runs its code block only when the condition inside its parentheses evaluates to true, and skips the block entirely if the condition is false.

Note: Any value can appear as a condition, JavaScript automatically converts it to true or false based on whether it's truthy or falsy.

Warning: Omitting curly braces around a multi-line if body only makes the very next single statement conditional, later lines run unconditionally.

उदाहरण: The if Statement

javascript

// Declare the constant `age`, set to `20`
// Declare the constant `age`, set to `20`
const age = 20;
// Check whether `age >= 18`
// Check whether `age >= 18`
if (age >= 18) {
  // Print "You are an adult." to the console
  // Print "You are an adult." to the console
  console.log("You are an adult.");
}

else

An else block runs only when the preceding if condition was false, providing a fallback path so exactly one of the two blocks always runs.

An else is always tied to the nearest unmatched if that precedes it, which matters once conditionals are nested.

Note: Use else specifically for a genuine alternative outcome, not just as a place to put unrelated code that always needs to run.

Warning: An else block must directly follow its matching if block, inserting other statements in between breaks the connection.

उदाहरण: else

javascript

// Declare the constant `age`, set to `15`
// Declare the constant `age`, set to `15`
const age = 15;
// Check whether `age >= 18`
// Check whether `age >= 18`
if (age >= 18) {
  // Print "Adult" to the console
  // Print "Adult" to the console
  console.log("Adult");
// Otherwise, run this branch
// Otherwise, run this branch
} else {
  // Print "Minor" to the console
  // Print "Minor" to the console
  console.log("Minor");
}

else if

else if allows checking additional conditions in sequence after the initial if, stopping and running the first block whose condition evaluates to true, useful when there are more than two possible outcomes.

Note: Order your else if conditions from most specific to least specific, since JavaScript stops at the first one that matches.

Warning: An else if chain always runs at most one block, even if multiple conditions would technically be true, only the first match executes.

उदाहरण: else if

javascript

// Declare the constant `score`, set to `75`
// Declare the constant `score`, set to `75`
const score = 75;
// Check whether `score >= 90`
// Check whether `score >= 90`
if (score >= 90) {
  // Print "A" to the console
  // Print "A" to the console
  console.log("A");
// Otherwise, if `score >= 70`, run this branch
// Otherwise, if `score >= 70`, run this branch
} else if (score >= 70) {
  // Print "B" to the console
  // Print "B" to the console
  console.log("B");
// Otherwise, run this branch
// Otherwise, run this branch
} else {
  // Print "C" to the console
  // Print "C" to the console
  console.log("C");
}

Nested if Statements

An if statement can be placed inside another if statement's block, letting you check a second condition only after the first has already been confirmed true.

Note: When nesting starts feeling too deep, combining conditions with && inside a single if is often clearer than several nested levels.

Warning: Deeply nested if statements can quickly become hard to read, consider refactoring into separate functions or combined conditions once nesting gets too deep.

उदाहरण: Nested if Statements

javascript

// Declare the constant `age`, set to `25`
// Declare the constant `age`, set to `25`
const age = 25;
// Declare the constant `hasLicense`, set to `true`
// Declare the constant `hasLicense`, set to `true`
const hasLicense = true;
// Check whether `age >= 18`
// Check whether `age >= 18`
if (age >= 18) {
  // Check whether `hasLicense`
  // Check whether `hasLicense`
  if (hasLicense) {
    // Print "Can drive" to the console
    // Print "Can drive" to the console
    console.log("Can drive");
  }
}

Ternary Operator and Short Circuit Evaluation

The ternary operator, condition ? valueIfTrue : valueIfFalse, is a compact alternative to a simple if/else, and short circuit evaluation lets && stop at the first falsy value and || stop at the first truthy value, without checking the rest.

Note: Short circuit evaluation with && is a common pattern for conditionally running code only when a value exists, like userData && userData.name.

Warning: Ternary operators are best for simple value selection, using them for complex logic with side effects makes code much harder to follow.

उदाहरण: Ternary Operator and Short Circuit Evaluation

javascript

// Declare the constant `age`, set to `20`
// Declare the constant `age`, set to `20`
const age = 20;
// Declare the constant `status`, set to `age >= 18 ? "adult" : "minor"`
// Declare the constant `status`, set to `age >= 18 ? "adult" : "minor"`
const status = age >= 18 ? "adult" : "minor";
// Print `status` to the console
// Print `status` to the console
console.log(status);
// Print `true || console.log("never runs")` to the console
// Print `true || console.log("never runs")` to the console
console.log(true || console.log("never runs"));

Live Example

Chapter Quiz — Complete all 26 topics to unlock

0/26 topics done

Complete these topics first:

← Previous Lesson JS Math Next Lesson → JS Switch

JS Conditionals

The if Statement

else

else if

Nested if Statements

Ternary Operator and Short Circuit Evaluation

Chapter Quiz — Complete all 26 topics to unlock

Login to run this code