DEV Community

Cover image for Conditional Statements in Javascript
Kamalesh AR
Kamalesh AR

Posted on

Conditional Statements in Javascript

#webdev #programming #javascript #career

Conditional statements in JavaScript direct the path of your code by executing different code blocks depending on whether a given condition evaluates to true or false. They allow programs to think, react, and make decisions dynamically based on user inputs or calculations.

JavaScript conditional statements are used to make decisions in a program based on given conditions. They control the flow of execution by running different code blocks depending on whether a condition is true or false.

  1. Conditions are evaluated using comparison and logical operators.
  2. They help in building dynamic and interactive applications by responding to different inputs.
  • Use if to specify a code block to be executed, if a specified condition is true
  • Use else to specify a code block to be executed, if the same condition is false
  • Use else if to specify a new condition to test, if the first condition is false
  • Use switch to specify many alternative code blocks to be executed
  • Use (? :) (ternary) as a shorthand for if...else

Types of Conditional Statements

  1. if Statement
  2. if-else Statement
  3. else if Statement

if-Statement:

The if statement checks a condition written inside parentheses. If the condition evaluates to true, the code inside {} is executed; otherwise, it is skipped.

  • Executes code only when a specified condition is true.
  • Useful for making simple decisions in a program.


let x = 20;

if (x % 2 === 0) {
    console.log("Even");
}

if (x % 2 !== 0) {
    console.log("Odd");
};
Enter fullscreen mode Exit fullscreen mode

Output:

Even

if-else Statement:

The if-else statement executes one block of code if a condition is true and another block if it is false. It ensures that exactly one of the two code blocks runs.

  • Used when there are two possible outcomes.
  • The else block runs when the if condition is not satisfied.


let age = 25;

if (age >= 18) {
    console.log("Adult")
} else {
    console.log("Not an Adult")
};
Enter fullscreen mode Exit fullscreen mode

Output:

Adult

else if statement:

The else if statement is used to test multiple conditions in sequence. It executes the first block whose condition evaluates to true.

  • Allows checking more than two conditions.
  • Evaluated from top to bottom until a true condition is found.


const x = 0;

if (x > 0) {
    console.log("Positive.");
} else if (x < 0) {
    console.log("Negative.");
} else {
    console.log("Zero.");
};
Enter fullscreen mode Exit fullscreen mode

Output:

Zero

Real time examples and practices:

Today, I learned about Conditional Statements in JavaScript and how they help a program make decisions based on different conditions.

First, I tried a simple if...else statement to check if a student passes or fails according to their marks. This helped me understand how JavaScript runs different code depending on whether a condition is true or false.

After that, I practiced using else if statements to assign grades like A, B, or C based on marks. It was interesting to see how JavaScript can check multiple conditions and choose the correct result.

I also drew flowcharts for the examples I worked on. Making the flowcharts helped me understand the logic better and see how the program moves from one step to another before giving the output.

Overall, this was a good practice session. I got a better understanding of conditional statements, how decision-making works in JavaScript, and how flowcharts can make coding concepts easier to understand.

The above mentioned image is my written notes, i have practiced in my session with guidance of my trainer. I have learned about the conditional statement, how it works, where it works and how it runs the code. By using flow charts easy to understand and know to write a code

References
https://www.geeksforgeeks.org/javascript/conditional-statements-in-javascript/
https://www.w3schools.com/js/js_conditionals.asp
Google

Top comments (0)