Programming Languages are tools that allows us to write code that instructs the computer to do something. In every programming language, the code needs to make decisions and carry out actions accordingly depending on different inputs. For example: Sarah can take a driving license only if she is greater than 18.
Conditionals in Javascript
Human beings make decisions all the time. For example, this morning, I was trying to make a decision between eating or not eating before writing this article. Conditional statements allow us to represent such decision making in JavaScript, from the choice that must be made. There are three ways of writing conditionals in Javascript:
If/else Statement
Switch Statement
Ternary Operator
If/else Statement:
I find them very easy and simple to use and understand. It also has a simple syntax:
if (condition/boolean) {
code that should work if condition is true;
} else{code that should work if condition is false;
In the syntax, we have:
- the keyword if
2.Set of parentheses where conditions are evaluated. These statements make use of comparison operators and return true or false. For example:
if (21 >= 100)
or if(20 === 1000)
3.If the code evaluated is true, the code in the curly brackets will be executed and if it is false it will not be executed and javascript will move to the next line of code.
if (21 >= 100) {
console.log('21 is greater!')
}
4.the else keyword. The else keyword is executed if the condition is false
if (21 >= 100) {
console.log('21 is greater!')
}else{
console.log('100 is greater!')
The if/else statement is quite easy to use and understand although it has some setbacks like: Any variable declared inside the code block cannot be accessed outside; instead it should be declared outside . For example:
const age = 18;
let drink;
if( age >= 18) {
console.log('Drink wine!')
}else {
console.log('Please drink water!')
Switch Statement
The switch statement is an alternative way of writing if/else statement. It is used for strict equality not comparing stuff although you can use it for comparism with some workaround but that is not what it was designed for.
const day = 'monday';
switch (day) {
case 'monday':
console.log('plan course structure');
console.log('Go to coding meetup');
break;
case 'tuesday':
console.log('Prepare theory videos');
break;
case 'wednesday':
case 'thursday':
console.log('Write code examples');
break;
case 'friday':
console.log('Record videos');
break;
case 'saturday':
case 'sunday':
console.log('Enjoy the weekend');
break;
default:
console.log('Not a valid day!');
}
In the syntax we have:
- The variable day and when it is equal to any of the weekdays, the activities of that day is printed in the console.
- The keyword case, followed by a choice that the expression/value could be, followed by a colon
- A break statement, followed by a semi-colon. If the previous choice matches the expression/value, the browser stops executing the code block here, and moves on to any code that appears below the switch statement.
- The keyword default, followed by exactly the same code pattern as one of the cases (bullets 3–5), except that default does not have a choice after it, and you don't need to break statement as there is nothing to run after this in the block anyway. This is the default option that runs if none of the choices match.
N/B : This can be also written with the if/else statement but will consist of numerous else/if statements and logical operators making it complex. Although, the switch statement is used less and less often.
Ternary Operator
It allows us to write something similar to an if/else statement but all in one line. It is used when used to take quick decisions and not a replacement for if/else statement and not used for a big block of code. It has three parts hence the name ternary:
condition
if part
else part
Example:
age >= 18 - condition
? console.log('I like to drink wine') : - if statement
console.log('I like to drink water'); - else statement
In syntax we have:
the condition which is meant to return a true or false value.
the if part which starts with a question mark and ends with a colon. It is executed if the condition is true.
the else part which ends with a semicolon and is executed in the console if the condition is false.
In conclusion:
All the three conditionals are not to replace anyone instead they have their usage in different contexts. Thank you for reading! I will be in the comment section.