JavaScript Conditional Statements

In JavaScript, When we need to execute specific blocks of code based on certain conditions, we always use Conditional Statements. It helps to control the flow of execution. In this article, we will learn about JavaScript Conditional Statements in depth with the help of examples.

1. What are Conditional Statements?

Depending on various situations, conditional statements can execute various actions. Depending on whether conditions are met, they evaluate expressions and run the associated code blocks.

2. Types of Conditional Statements

if statement
if…else statement
if…else if…else statement
switch statement
Ternary (? :) operator
Logical operators (&&, ||, !)

if Statement

The if statement executes a block of code if the given condition evaluates to true.

Syntax

if (condition)
{
    // Code to execute if condition is true
}

Example

let age = 20;
if (age >= 18)
{
    console.log("You are eligible to vote.");
}

if…else Statement

The if…else statement allows for two possible outcomes: one when the condition is true and another when it is false.

Syntax

if (condition)
{
    // Code to execute if condition is true
}
else
{
    // Code to execute if condition is false
}

Example

let num = 10;

if (num % 2 === 0)
{
    console.log("Even number");
}
else
{
    console.log("Odd number");
}

if…else if…else Statement

When multiple conditions need to be checked, an if…else if…else statement is used.

Syntax

if (condition1)
{
    // Code to execute if condition1 is true
}
else if (condition2)
{
    // Code to execute if condition2 is true
}
else
{
    // Code to execute if none of the conditions are true
}

Example

let score = 85;

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("Fail");
}

switch Statement

The switch statement allows for multiple possible values of an expression. It is an alternative to using multiple if…else if statements.

Syntax

switch(expression)
{
    case value1:
        // Code to execute if expression === value1
        break;
    case value2:
        // Code to execute if expression === value2
        break;
    default:
        // Code to execute if none of the cases match
}

Example

let day = "Monday";

switch (day)
{
    case "Monday":
        console.log("Start of the work week");
        break;
    case "Friday":
        console.log("Weekend is near");
        break;
    default:
        console.log("Regular day");
}

Ternary Operator

The ternary operator is a shorthand way of writing if…else statements.

Syntax

condition ? expressionIfTrue : expressionIfFalse;

Example

let age = 17;

let vote_result = (age >= 18) ? "Eligible for voting" : "Not eligible for voting";

console.log(vote_result);

Output

Not eligible for voting

Logical Operators

These type of operators are used for combine multiple conditions.

Operators	Description
&&	Logical AND
\|\|	Logical OR
!	Logical NOT

Example

let isAdult = true;

let hasID = false;

if (isAdult && hasID)
{
    console.log("Allowed entry");
}
else
{
    console.log("Entry denied");
}

Best Practices

Always use switch statements, When dealing with multiple cases. It make the code cleaner.
Try to keep condition simple, do not complex. It improve readability.
If you are writing simple condition, use ternary operator. It is great for simple conditions. But always avoid in case of complex logic.
When appropriate, utilize short-circuiting and steer clear of pointless checks.

Conclusion

Programmers can execute code selectively based on conditions by using conditional statements, which are an essential component of JavaScript. Writing legible and efficient code is facilitated by knowing and successfully utilizing if, else, switch, ternary, and logical operators. You will be able to create dynamic apps much more effectively if you can grasp these ideas.