Before moving into Conditional Statements, let us explore
What are Javascript statements?
Statements are a set of instructions in programming languages that perform certain tasks.
Javascript Statements are often called Javascript Code.
Javascript statements are a combination of variables, operators, keywords, and expressions.
In Javascript each statement is separated by semi-colon( ; )
Javascript statements are executed in the order that they are declared.
What are Conditional Statements?
When we want to execute Javascript statements, when certain conditions are fulfilled, we need conditional statements.
There are four types of Conditional Statements are,
- If statement
- If…else Statement
- else if Statement
- Switch statement
If statement:-
Syntax:-
if( Condition ){
}
If statement is used in the situation only when the condition is true, the particular Javascript Code / Statement given inside the if block should get executed.
Let us understand by a simple example,
let age = 18;
if( age >= 18){
console.log(“Eligible for Voting”);
}
In the above example, we need to print “eligible for voting” only when the age of the user is greater than or equal to 18. So, we use the if statement here because, only when the condition is true(i.e., when the age of the user is greater than or equal to 18) it should console the output in the browser console.
We will try it with a false condition now,
let age = 17;
if(age >= 18){
console.log(“Eligible for Voting”);
}
In the above example, the age of the user is 17 so it will not pass the condition because the condition is false(i.e., 17 is not equal to or greater than 18). So, it will not print anything in the browser console.
If…else Statement:-
Syntax:-
if( Condition ){
}
else{
}
If…else statement is used in the situation when the condition is true, the particular Javascript Code / Statement given inside the if block should get executed, and when a condition is false, the particular Javascript Code / Statement given inside the else block will get executed.
Let us take the same example as we have taken in if statement,
let age = 17;
if( age >= 18){
console.log(“Eligible for Voting”);
}
else{
console.log(“Not Eligible for Voting”);
}
In the above example, we are having two conditions: one is true and the other one is false. If the user age is greater than or equal to 18 - if block will be executed(i.e., true condition) and if the user age is less than 18 - else block will be executed( i.e., false condition).
else if Statement:-
Syntax:-
if( Condition ){
}
else if( Condition ){
}
else{
}
else if statement is used in the situation where we need to check with multiple conditions and execute the Javascript Code / Statements.
Let us understand by Example,
We will take the example to print the grade for the students according to their marks.
let marks= 75;
if(marks<90 && marks>=100){
console.log("O Grade");
}
else if(marks<80 && marks>=90){
console.log("A+ Grade");
}
else if(marks<70 && marks>=80){
console.log("A Grade");
}
else if(marks<60 && marks>=70){
console.log("B+ Grade");
}
else if(marks<50 && marks>=60){
console.log("B Grade");
}
else{
console.log("Fail");
}
In the above example as we have seen in previous blogs we have a logical operator(&&) and it is used in conditional statements. A logical operator is used to give a range of Values to check-in conditional statements.
What we are doing in this example is student Mark is 75, so according to the mark we need to print the grade.
At first, we will check the if condition and it doesn't satisfy the condition(i.e., 75 is not between 90 to 100) and next we move to the first else if Condition and it also doesn't satisfy the condition(i.e.,75 is not between 80 to 90). Moving to second else if Condition and now the condition satisfies(i.e., 75 lies between 70 to 80)and execute the Javascript Statements inside that else if block.
There is a case when any of the conditions doesn't satisfy and at that time the else block gets executed.
Therefore with else if Condition we can check for multiple conditions and execute the Javascript Statements / Code.
Switch Statement:-
Syntax:-
switch( expression ){
case value_1:
break;
case value_2:
break;
case value_3:
break;
case value_4:
break;
default:
}
The switch statement matches the expression with the case value and then executes the Javascript Code / Statement inside that. A break statement is used to break the condition and bring it out after the particular javascript statement gets executed.
Let us understand by example,
We need to print the top three student rank in the university in words, based on their rank
let Rank = 2;
switch( Rank ){
case 1:
console.log(“University first”);
break;
case 2:
console.log(“University Second”);
break;
case 3:
console.log(“University third”);
break;
default:
console.log(“You are not in the top 3 ranks”);
}
In the above example, we are going to match the expression with the case value and execute the statements. Here, we are trying to print the rank in words according to the value given in the Rank variable.
The value stored in a rank variable is 2 and now we are going to match with the case value when we try to match with the first case it is doesn’t match and it’s a move to the next case and perform the task till the case value is matched with the expression value.
A break statement is used to break the condition and bring it out.
A default statement is used to give a default statement when the expression value doesn’t match any of the case values.
You might think the switch statement looks similar to the else if statement using a switch statement we can also perform an expression and then we can match it with the case value. In our example just we stored a value in a variable and directly passed it as an expression value inside the switch statement.
Looping Statements:-
Looping statements are used to repeatedly run Javascript statements for a specified number of times.
There are three types of Looping statements are,
- for loop
- while loop
- do-while loop
for loop:-
for loop is used to iterate and execute Javascript statements for a specified number of times repeatedly till the condition gets false.
for loop has three parts are
- Initialization
- Condition
- Increment
Syntax:-
for(Initialization; condition; increment){
}
Let us understand by example,
For example to print the numbers from 0 to 10
let n = 10
for(i = 0;i <= n;i++){
console.log(i);
}
Output
0
1
2
3
4
5
6
7
8
9
10
In the above example, we need to print the number from 0 to 10. First, we are initializing the value, and then we are given the condition and if the condition is satisfied Javascript statement inside for loop is executed, and then incrementing the value, and the loop repeats until the condition gets false.
Under for loop, we have two loops are,
It is similar to for loop, We will see these loops in detail in Object Concept.
while loop:-
Syntax:-
while( condition ){
// Javascript statement goes here
}
Only when the condition is true the Javascript Statements or Code inside while statement will get executed.
Example:-
Let us take the same example to print the numbers from 0 to 10
let n = 0;
while(n <= 10){
console.log(n);
n++;
}
In the above example, only when the condition is satisfied it will go into the loop and execute the Javascript Statements and then the value is incremented, and again the same loop repeats until the condition gets failed.
do-while loop:-
Syntax:-
do{
// Javascript statement goes here
}while( condition )
In the do-while loop, before it checks the condition it will execute the Javascript statement once and then it will check the condition and the process is the same as we have seen for all other loops.
Let us understand by example,
To print the numbers 1 to 10
let n = 1;
do{
console.log(n);
n++;
}while( n <=10 )
In the above example, before checking the condition it will execute the Javascript statement and then it checks for the condition and follows the same process followed in for loop and while loop.
If any case the condition is failed at the first check, the loop will be executed once.
In the next blog, we will explore Javascript Functions.
