Friday , 17 November 2017
Home / Programming / JavaScript / Conditional Statements – JavaScript Tutorial
Conditional Statements
Conditional Statements

Conditional Statements – JavaScript Tutorial

This tutorial is part of the JavaScript tutorial series for beginners. To view the whole list of tutorials available and the order in which you should follow them, then click here.

In this tutorial, we’re going to discuss what conditional statements are. In certain situations, you may want to perform some checks and respond accordingly. Let’s take a look at how to do this.

Using Conditional Statements

Conditional Statements are pretty easy to use. Clear your script and insert this bit of code.

Let’s see what happens by opening our HTML document.  You should get a message in an alert box saying This is true. Let’s see how this works.

We first create a variable named num and assign it the value 5.  The real magic is in the if-else statements. To check something, we use the if statement. This statement checks if a certain condition is true. If so, then the block of code after it is executed. You surround your block of code with curly brackets.

The actual condition is in the parenthesis. Inside we have num == 5. This is called our condition. A condition is a check that’s performed to tell whether something is true or not.  If the condition returns true, then your block of code runs. What we’re doing in our condition is checking if the variable num is equal to 5.

I’m introducing a comparison operator which is ==. You may be wondering, what’s the difference between 1 equal sign and 2 equal signs? If you use 1 equal sign, then you’re assigning a value. You’re not checking whether or not something is true. By using 2 equal signs, you’re then comparing 2 values.

There are other comparison operators that you can use. Here’s what they are.

Comparison OperatorDescription
==Is Equal to
===Is Equal to both value and data type
!=Is not equal to
!==Is no equal to both value and data type
>Greater than
<Less than
>=Greater than or equal to
<=Less than or equal to

You’re free to use any of these comparison operators when comparing 2 values. Let’s update our value of the num variable to 6. You should get a new messaging stating this is false.  This is because 6 is not equal to 5. Our condition is checking whether these 2 values were equal. If we changed the comparison operator to != then we would end up getting true because 6 is not indeed equal to 5. Which is what you were checking.

In this case, JavaScript will search for an alternative. This is where our else statement comes in to play. If all conditions were checked and non returned true, then JavaScript will execute the else statement’s block of code.

You don’t have to define an else statement. This is for your convenience and is is suitable for those just in case situations.

What if you wanted to do a couple of other checks before your code resorts to the default else statement? This where the else-if statement comes into play. Update your code to this.

The else if statement allows you to check another condition and run a totally different block of code just in case the first condition check is false. In my example, I create 2 else if statements. You can create as many checks as you want in JavaScript. There are some rules though.

  • You can only create an else statement if the if statement is present beforehand. Same goes for the else if statement.
  • You can create as many else if statements as you want.
  • You can create another if statement after you just created one. What ends up happening is that the first if statement is ended and if you decide to create an else statement for the 2nd if statement, then that else statement only applies to the 2nd if statement and not the first.
  • Else if statements are executed by order. So be sure to perform the checks in an order you’re comfortable with. Once your script finds a condition that is true, it won’t bother checking any other related statements.

You’re also allowed to have nested conditional statements. Meaning you can have an if statement inside an if statement. Conditional statements allow you to check for anything. It’s very useful when it comes to web security. We’ll soon see how this is done in a future tutorial.

Conclusion

Conditional statements can be useful for checking certain situations. In our next tutorial, we’ll talk about logical operators and their use in conditional statements.

About Jasko Koyn

Check Also

Try-Catch Statement

Try-catch Statement – Advanced JavaScript Tutorial

The try-catch statement is a unique way to handle errors. When errors occur, usually it …

Leave a Reply

Your email address will not be published. Required fields are marked *

ULTIMATE WORDPRESS DEVELOPMENT COURSE
Want to learn how to create your own custom WordPress plugins and themes? Check out my course!
Get 93% off my course. You'll also learn how to integrate WooCommerce and BuddyPress into your projects. This is a limited time offer
Yes, I would like to get 93% off your course!
No Thanks!
close-link