Javascript Basics

Javascript If Else Statement

Before proceeding further lets first understand why if else if statement requirement came?

Lets consider the simple situation, login process. A user is only allowed to access web pages of a website, if the user has logged in with valid credentials.

See in the above case, “if” logic is there. Logic for login is as below:

If user has provided valid login credentials….

Then allow the user to access rest pages

else show a warning message regarding invalid login credentials.

To better understand to handle such situations, we must have to understand if else statement.

if else statement

Syntax

if a condition is met

Execute required tasks

else

Execute other required tasks

 

Note: Here task could be any job that needed to be executed depending upon a condition.

<script>

if(condition){

task1;

task2;

task3;

.

.

.

taskn;

}else{

anotherTask1;

anotherTask2;

anotherTask3;

.

.

.

anotherTaskn;

}

</script>

Printing values is also a job or task.

Lets say if 5 is greater than 6 then print 5 is greater than 6 else print 5 is less than 6.

Example:

<script>

if(5>6){

alert(“5 is greater than 6”);

}else{

alert(“5 is less than 6”);

}

</script>

 

Looking at the above example, we can easily say the output will be “5 is less than 6”.

The reason for this is, (5>6) condition did not meet, so the code inside else block executed.

Now, guess what would be the output of this following Javascript code?

<script>

if(5<6){

alert(“5 is less than 6”);

}else{

alert(“5 is not less than 6”);

}

</script>

 

It will print “5 is less than 6”, because (5<6) condition fulfilled so the codes inside the if block got executed.

Now can you guess the output of the below code!

<script>

if(num1>num2){

alert(“Num1 is greater than Num2”);

}else{

alert(“Num2 is not greater than Num2”);

}

</script>

It is not possible to say the output just looking at the code. We have to run the code to get the result.

Here the point, is, in real project environment our Javascript file is going to receive values from different source, so according to it we have to code in the Javascript file.

We need to execute certain codes only if a condition is met other wise run other set of codes.

if elseif  else statement

if elseif else statement is different than if else statement.

What is the difference?

In if else statement, we run certain codes if a condition is met otherwise we run other set of codes.

But there might be situations where we need to run certain codes if a condition is met, otherwise run another set of codes if a condition is met, otherwise run another set of codes if a condition is met and if none of the condition is met then execute rest of the codes.

Syntax

<script>

if(condition1){

task 1;

task 2;

task 3;

.

.

.

taskn;

}elseif(condition2){

another-task1;

another-task2;

another-task3;

another-task4;

.

.

.

another-taskn;

}elseif(condition3){

another-another-task1;

another-another-task2;

another-another-task3;

.

.

.

another-another-task4;

}else{

rest-task-1;

rest-task-2;

rest-task-3;

.

.

.

rest-task-4;

}

</script>

 

If the above syntax is appearing bit confusing then below example is going to help you.

Example

Take two variables, assign them values, and with the help of if elseif else statement determine which number is greater or both numbers are same.

<script>

var num1=20;

var num2=20;

if(num1<num2){

alert(“num1 is less than num2”);

}elseif(num1>num2){

alert(“num1 is greater than num2”);

}else{

alert(“num1 and num2 are both same”);

}

</script>

 

Output: num1 and num2 are both same.