JavaScript Conditional Statements

A conditional statements, also known as a control statement or branching statement, is a fundamental JavaScript programming construct that allows a program to make decisions and execute different blocks of code based on specific conditions.

In JavaScript, conditional statements allow you to make decisions in your code based on certain conditions. You can use if, else if, and else statements to create branching logic. Let’s walk through an example of how you might use conditional statements to check for discounts in the grocery section of Amazon.in.

Suppose you want to check if a user is eligible for a discount based on the total amount they spend on groceries. You have the following conditions:

• If the user spends more than 1000 INR, they get a 10% discount.
• If the user spends more than 500 INR, they get a 5% discount.
• If the user spends less than 500 INR, they don’t get a discount.

Here’s a step-by-step explanation of how this code works

Using if statement for the first condition (more than 1000 INR):

// User's total grocery spending
const grocerySpending = 1200; // Replace this with the actual user's spending

if (grocerySpending > 1000) {
    const discount = 0.10 * grocerySpending;
    console.log("You get a 10% discount of " + discount + " INR.");
}

Using if and else if statements for the second condition (more than 500 INR but less than or equal to 1000 INR):

// User's total grocery spending
const grocerySpending = 700; // Replace this with the actual user's spending

if (grocerySpending > 1000) {
    const discount = 0.10 * grocerySpending;
    console.log("You get a 10% discount of " + discount + " INR.");
} else if (grocerySpending > 500) {
    const discount = 0.05 * grocerySpending;
    console.log("You get a 5% discount of " + discount + " INR.");
}

Using if, else if, and else statements for all three conditions:

// User's total grocery spending
const grocerySpending = 400; // Replace this with the actual user's spending

if (grocerySpending > 1000) {
    const discount = 0.10 * grocerySpending;
    console.log("You get a 10% discount of " + discount + " INR.");
} else if (grocerySpending > 500) {
    const discount = 0.05 * grocerySpending;
    console.log("You get a 5% discount of " + discount + " INR.");
} else {
    console.log("You don't get a discount.");
}

The output depends on the value of grocerySpending, and the appropriate discount message is displayed. This is how conditional statements in JavaScript help you make decisions based on different conditions.

Let’s Move to Switch Statement

A switch statement is another way to handle multiple conditions in JavaScript. It provides an alternative to a series of if, else if, and else statements when you have a single value to test against multiple possible cases. Here’s how a switch statement works:

1. You specify an expression to evaluate.
2. The expression’s value is compared to each case value inside the switch block.
3. If a match is found, the code inside that case block is executed.
4. If no match is found, you can specify a default block that will execute when none of the cases match.

Let’s consider a different example related to Amazon.in where we’ll use a switch statement to determine the delivery time based on the chosen shipping option.

// User's chosen shipping option
const shippingOption = "Express";

switch (shippingOption) {
  case "Standard":
    console.log("Your order will arrive in 5-7 business days.");
    break;
  case "Express":
    console.log("Your order will arrive in 2-3 business days.");
    break;
  case "One-Day":
    console.log("Your order will arrive tomorrow.");
    break;
  default:
    console.log("Shipping option not recognized.");
}

In this example:

• The shippingOption variable holds the user’s chosen shipping option.
• We use a switch statement to evaluate the value of shippingOption.
• Each case represents a different shipping option, along with the associated delivery time.
• The code inside the case block that matches the shippingOption value is executed.
• If none of the case values match, the code inside the default block is executed, indicating that the shipping option is not recognized.

The output depends on the value of shippingOption, and the corresponding delivery time message is displayed. If the user selects an option that doesn’t match any case, the default message is shown.

Conclusion

Conditional statements are essential building blocks in JavaScript programming, enabling your code to make decisions and execute different actions based on varying conditions. Understanding and effectively using if, else if, else, and switch statements allows you to add logic and complexity to your applications, making them more dynamic and responsive to user input.

Both if-else and switch statements have their place in JavaScript code. If-else is more flexible for complex conditions and comparisons that involve ranges or multiple variables, while switch is ideal for checking a single variable against numerous specific values. Mastering these control structures will greatly enhance your ability to write efficient and readable JavaScript code, paving the way for more advanced programming concepts and techniques.

Frequently Asked Questions