beginner

Conditional statements


If Statement

The if statement is the foundation of conditional logic in Javascript. It executes a block of code if a specified condition is evaluated as true.

let age = 18;
let storeIsOpen = true;
if (true) {
  console.log("This will always execute."); // Will be console logged
}
if (age == 18) {
  // Will only be true if age is 18 and in our case it is
  console.log("You are 18."); // Will be console logged
}

if (age >= 18) {
  // true only if age is greater or equal to 10
  console.log("You're an adult."); // Will be console logged
}
if (age >= 18 && storeIsOpen) {
  // true if age is greater or equal to 18 AND storeIsOpen variable is true
  console.log("You're an adult and the store is open."); // Will be console logged
}

if (age >= 18 && !storeIsOpen) {
  console.log("You're an adult and the store is closed.");
}

if (age < 18) {
  console.log("You're not an adult.");
}

If-Else Statement

The if-else statement extends the if statement by providing an alternative block of code to execute when the condition is false.

let time = 14;
if (time < 12) {
  console.log("Good morning!");
} else {
  console.log("Good afternoon!");
}

If-Else If-Else Statement

When dealing with multiple conditions, the if-else if-else statement offers a structured way to handle various scenarios.

let score = 75;
if (score >= 90) {
  console.log("A grade");
} else if (score >= 80) {
  console.log("B grade");
} else if (score >= 70) {
  console.log("C grade");
} else {
  console.log("You need improvement.");
}

Ternary Operator

The ternary operator provides a concise way to write conditional statements in a single line. You can make multiple ternary operators in the same line but then readability becomes very hard very fast.

let isRaining = true;
let weatherMessage = isRaining ? "Take an umbrella." : "Enjoy the sun!";
// Above is same as
if (isRaining) {
  weatherMessage = "Take an umbrella.";
} else {
  weatherMessage = "Enjoy the sun!";
}
console.log(weatherMessage); // Take an umbrella.

Switch Statement

The switch statement is used when you have multiple cases to consider. It allows you to execute different code blocks based on the value of an expression. If no case is matched then it will execute default.

let day = "Monday";
switch (day) {
  case "Monday":
    console.log("Start of the workweek.");
    break;
  case "Friday":
    console.log("Weekend is near!");
    break;
  default:
    console.log("Normal weekday.");
    break;
}

If you want to handle multiple cases with the same code then you can make cases fallthrough by omitting break;

let day = "Monday";
switch (day) {
  case "Monday":
    console.log("Start of the workweek.");
    break;
  case "Friday":
    console.log("Weekend is near!");
    break;
  case "Saturday":
  case "Sunday":
    console.log("It's weekend!");
    break;
  default:
    console.log("Normal weekday.");
    break;
}

You might wonder whether to use multiple if-elseif or switch. Usually, if-elseif is used when there are one or two different alternatives and switch when there are more alternatives.

What now?

Now you can create a lot of different paths of execution for your code, based on what the given variables are. Go and think of some usecases.

Previous Tricky JS part 1
Next Loops