In JavaScript the if statement is used to execute different statements based on conditions.

It is possible, but it is not mandatory to insert the else, as I will explain later.

So here is the syntax of the conditional statement:


if(condition) {
   //block 1 of instructions executed if the condition is true
} 

If we use the else the syntax becomes this:


if(condition) {
   //block 1 of instructions executed if the condition is true
} else {
   //block 2 of instructions executed if the condition is false
}

Where condition takes on a boolean value, i.e. true or false.

Here are some examples of possible conditions that can be specified:

condition = a> 0

or

condition = a> b

and so on.

Therefore, if the condition is true, one or more instructions indicated in curly brackets are executed, otherwise the instructions indicated in the else are executed.

So if the number is greater than 100, ‘the number is greater than 100’ will be printed on the html page, otherwise ‘the number is not greater than 100’ will be printed.

JavaScript if statement – example 1

In this example we check if a number is positive and we write it in the html page with the writeln method.

Banner pubblicitario

if(number > 0) {
   document.writeln('The number is positive');
} 

JavaScript if statement – example 2

So let’s take an example of an if else statement in JavaScript, where we check if a number is greater than 100 or not.


if(number > 100) {
   document.writeln('number is greater than 100');
} else {
   document.writeln('number is not greater than 100');
}

JavaScript if statement – else if cascaded

You can also specify multiple conditions using else if, following this syntax:


if(condition) {
   //block 1 of instructions executed if the condition is true
} else if(condition){
   //block 2 of instructions executed if the condition is false
} else {
   //block 3 of instructions executed if the condition 1 e 2 are false
}

So you can have the following cases:

  • Condition1 is true, then the block1 of statements specified in curly brackets are executed. The second condition and the else are therefore discarded.
  • Condition1 is false, then we do not execute the block1 of statements specified in curly brackets and we go on to evaluate condition2. If condition2 is true, block2 of instructions indicated in curly brackets is executed,
  • Condition1 is false, then we do not execute the block1 of statements specified in curly brackets and we go on to evaluate condition2. If condition2 is false, go to else and then execute block3 of instructions.

You can also insert other else if in cascade, as many as needed.

JavaScript if statement – example 3

In this example we check if a number is positive, negative or null.


if(number > 0) {
   document.writeln('The number is positive');
} else if (number < 0) {
  document.writeln('The number is negative');
} else {
  document.writeln('The number is null');
}

Then we use the first condition to evaluate if the number is positive. Then we insert a second condition to check if a number is negative. Therefore it is not necessary to insert a third condition because if the number is not positive and not even negative then it will be null. So let's just insert an else without an if.

Conclusion

In this lesson we talked about the if else statement in JavaScript, in the next lessons we will give other examples.

Some useful links

JavaScript tutorial

JavaScript Calculator

Object in JavaScript

For in loop

Caesar cipher decoder

Slot Machine in JavaScript