Greetings, coding explorer!

Today, we're diving into conditional statements, a key principle in programming. Conditionals, like day-to-day decisions, are dictated by circumstances. For instance, should it rain, you'd opt for an umbrella. Code operates in a similar manner. They control the flow of code, mobilizing actions based on whether conditions are true or false. We'll be exploring this concept today.

Regard the if statement as the gatekeeper of conditionals. It definitively states, "If this is true, then perform this specific action". It’s comparable to choosing between chocolate and vanilla ice cream. Let’s take a closer look at an example:

JavaScript
Copy to clipboard
1let myScore = 100;
2let friendScore = 80;
3// If our score is higher, we get to brag about it!
4if (myScore > friendScore) {
5    console.log("Score bragging rights are mine!");
6    console.log("Victory is sweet!");
7}
8
9console.log("Game over.");

Note that in JavaScript, the conditions we inspect using if statement must always be wrapped in parentheses, like so: if (condition). The if statement applies to all statements within its block formed by braces ({}).

In the above script, since myScore is greater than friendScore, both lines within the block are executed. If myScore was smaller than friendScore, they would not.

Regardless of the condition's verdict, "Game over." is printed because it's situated outside the if block.

Often, we're presented with multiple potential outcomes. For such instances, we utilize the else statement, to account for the "otherwise" scenario. Let's see it in action:

JavaScript
Copy to clipboard
1let myScore = 60;
2let friendScore = 80;
3// If our score is higher, we brag. Else, we console ourselves!
4if (myScore > friendScore) {
5    console.log("I scored higher!");
6    console.log("Hurrah!");
7} else {
8    console.log("My friend scored higher. Well played.");
9    console.log("I’ll come back stronger next time.");
10}
11
12console.log("Game over.");

In this scenario, if the if statement's condition is met, the program executes only the block within the if statement. However, if the condition is false and thereby the first block is not executed, the program moves to execute the block within the else clause instead.

Again, irrespective of the chosen path, "Game over." is always printed as it resides outside the conditionals’ realm.

There are occasions when we must consider several distinct conditions. This is where else if flourishes, lending nuanced control over multiple possibilities.

JavaScript
Copy to clipboard
1let myScore = 80;
2let friendScore = 80;
3// If our score is higher, we brag.
4// If our score is lower, we console ourselves.
5// If our scores are tied, we declare a stalemate.
6if (myScore > friendScore) {
7    console.log("I scored higher!");
8} else if (myScore < friendScore) {
9    console.log("Oh no, my friend scored higher!")
10} else {
11    console.log("It's a tie game!")
12}

The else if clause is checked only if the initial if statement is false. If the else if condition turns out to be true, its block of code will be executed. However, if its condition is also false, the flow of the program will descend to any subsequent else if clauses, checking their conditions, or to the else statement if there are no more else if clauses. The else block always executes as a fallback if none of the preceding conditions in the if and else if clauses are met. As such, the program can follow a multitude of paths, offering you granular control over its operation.

Logical operators in JavaScript allow us to evaluate multiple conditions. The && operator checks if both conditions are true, || checks if either one is true, and ! negates a condition.

JavaScript
Copy to clipboard
1let isWeekend = true;
2let isHoliday = false;
3let isSunny = false;
4
5if (isWeekend && isSunny) {
6  console.log("It's the weekend and it's sunny, let's go to the park!");
7} else if (isHoliday && !isSunny) {
8  console.log("It's a holiday but not sunny, let's go to the museum."); 
9} else if (isWeekend || isHoliday) {
10  console.log("It's either weekend or a holiday, let's decide based on the weather.");
11} else {
12  console.log("It's neither the weekend nor a holiday, let's stay at home.");
13}

Bravo! Today, we've unlocked the magic of conditionals in JavaScript. By closely examining if, else, and else if, we've learned how these constructs shape the flow of a program.

Let’s solidify your learning with some practice exercises. Keep coding and broaden your horizons with conditional statements! Happy exploring!