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:
JavaScript1let 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:
JavaScript1let 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.
JavaScript1let 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.
JavaScript1let 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!