Control Structures
Conditionals are used to perform different actions based on different conditions. The most common conditional statements in JavaScript are if, else if, and else.
If Statement
The if statement executes a block of code if a specified condition is true.
let likes = 150;
if (likes > 100) {
console.log('You are popular!');
}
Output
You are popular
Explanation
In this example, the condition likes > 100 is evaluated. If it is true, the message 'You are popular!' is logged to the console.
Reasoning
The if statement checks whether likes is greater than 100. Since likes is 150, which is greater than 100, the condition is true, and the code inside the if block is executed.
Else statement
The else statement executes a block of code if the same condition is false.
let followers = 50;
if (followers > 100) {
console.log('You are popular!');
} else {
console.log('Keep engaging with your audience!');
}
Output
Keep engaging with your audience!
Explanation
In this example, if the condition followers > 100 is false, the message 'Keep engaging with your audience!' is logged to the console.
Reasoning
The if statement checks whether followers is greater than 100. Since followers is 50, which is not greater than 100, the condition is false, and the code inside the else block is executed.
Else If Statement
The else if statement specifies a new condition if the first condition is false.
let comments = 75;
if (comments > 100) {
console.log('You have a lot of comments!');
} else if (comments > 50) {
console.log('You have a decent number of comments!');
} else {
console.log('Try to get more comments!');
}
Output
You have a decent number of comments!
Explanation
In this example, if comments > 100 is false but comments > 50 is true, the message 'You have a decent number of comments!' is logged to the console.
Reasoning
The if statement checks whether comments is greater than 100. Since comments is 75, which is not greater than 100, the condition is false, and the else if condition is checked. Since comments is greater than 50, the code inside the else if block is executed.
Switch Statement
The switch statement evaluates an expression and executes code based on the matching case.
let day = new Date().getDay();
switch (day) {
case 0:
console.log('Sunday');
break;
case 1:
console.log('Monday');
break;
case 2:
console.log('Tuesday');
break;
case 3:
console.log('Wednesday');
break;
case 4:
console.log('Thursday');
break;
case 5:
console.log('Friday');
break;
case 6:
console.log('Saturday');
break;
default:
console.log('Unknown day');
}
Explanation
In this example, the current day is retrieved using new Date().getDay(), which returns a number from 0 (Sunday) to 6 (Saturday). The switch statement checks the value of day and logs the corresponding day name to the console.
This output will vary depending on the day the code is executed. For example, if the code is run on a Monday, the output will be:
Output
Monday
Reasoning
The switch statement matches the value of day to the corresponding case and executes the code in that case block. If day is 1, 'Monday' is logged to the console.
Ternary Operator
The ternary operator is a shorthand for if...else statements. It takes three operands: a condition, a value to return if the condition is true, and a value to return if the condition is false.
let likes = 150;
let popularity = (likes > 100) ? 'You are popular!' : 'Keep engaging with your audience!';
console.log(popularity);
Explanation
In this example, the condition likes > 100 is evaluated. If it is true, 'You are popular!' is assigned to popularity. If it is false, 'Keep engaging with your audience!' is assigned to popularity.
Output
You are popular!
Reasoning
The ternary operator evaluates likes > 100. Since likes is 150, which is greater than 100, the condition is true, and 'You are popular!' is assigned to popularity.
Loops
Loops allow you to execute a block of code multiple times. The most common loops in JavaScript are for, while, and do...while.
For Loop
The for loop repeats a block of code a specified number of times.
for (let i = 0; i < 5; i++) {
console.log(`Iteration ${i}`);
}
Explanation
In this example, the for loop runs 5 times, logging 'Iteration 0' to 'Iteration 4' to the console.
Output
Iteration 0
Iteration 1
Iteration 2
Iteration 3
Iteration 4
While Loop
The while loop repeats a block of code as long as the specified condition is true.
let i = 0;
while (i < 5) {
console.log(`Iteration ${i}`);
i++;
}
Output
Iteration 0
Iteration 1
Iteration 2
Iteration 3
Iteration 4
Do...While Loop
The do...while loop is similar to the while loop, but it executes the block of code at least once before checking the condition.
let i = 0;
do {
console.log(`Iteration ${i}`);
i++;
} while (i < 5);
Output
Iteration 0
Iteration 1
Iteration 2
Iteration 3
Iteration 4
- Use if...else statements for straightforward conditional checks.
- Use switch statements for multiple conditions based on the same variable.
- Use ternary operators for simple conditional assignments.
- Choose the appropriate loop based on the task and condition to ensure code readability and efficiency.
FAQ
Q: When should I use a `switch` statement over `if...else`?
A: Use a `switch` statement when you have multiple conditions based on the same variable or expression. It can make your code cleaner and more readable compared to multiple `if...else if` statements.
Q: Can I nest control structures?
A: Yes, you can nest control structures within each other. For example, you can have an `if` statement inside a `for` loop, or a `switch` statement inside an `else` block. Just be mindful of readability and maintainability.
Q: What is the difference between `while` and `do...while` loops?
A: A `while` loop checks the condition before executing the block of code, whereas a `do...while` loop executes the block of code at least once before checking the condition.
Q: How can I exit a loop early?
A: You can use the `break` statement to exit a loop early. You can also use the `continue` statement to skip the current iteration and proceed to the next iteration.