TOC

The community is working on translating this tutorial into Croatian, but it seems that no one has started the translation process for this article yet. If you can help us, then please click "More info".

Control structures:

The IF statement

Controlling the flow of your code is one the most important concepts of programming, and the most basic control structure is probably the if statement. It simply allows you to specify a condition for whether or not the next line(s) should be executed. Here's a simple example:

if(something == true)
	alert("something is true!");

The first line is the if statement - a simple condition for whether or not the next line should run. We can try changing it into something that will take input from the user, to really test if it works or not:

var answer = confirm("Is it true?");
if(answer == true)
	alert("I knew it was true!");

Remember, as we talked about previously in this tutorial: If you need the condition to contain more than one line, you have to surround it with curly brackets, creating a block of code:

var answer = confirm("Is it true?");
if(answer == true)
{
	alert("I knew it was true!");
	alert("I knew it too!");
}

Multiple conditions

The if statement works simply by checking whether the supplied condition can be considered true. This allows you to specify as many conditions as you want to. We can use the && (AND) as well as the || (OR) operators (more on those later) to add conditions:

var age = prompt("What's your age?");
var hasDriversLicense = confirm("Do you have a drivers license?")
if(hasDriversLicense || (age >= 18 && age <= 80))
	alert("I guess you can be allowed to drive a car!");

So, if you have a drivers license, OR an appropriate age (between 18 and 80), this code will allow you to drive a car. That's not a very realistic example, but hopefully it does the job of illustrating how you can use multiple conditions in your if statement.

if...else

Our current if statement only does something if the condition is true, but we may need to do something else in case its NOT true. For that, we have the else statement, which obviously only works together with the if statement. Here's an example:

var answer = confirm("Is it true?");
if(answer == true)
	alert("I knew it was true!");
else
	alert("Oh well, guess not then...");

And again, if you need more lines of code for one (or both) of the conditions, just surround it with a block:

var answer = confirm("Is it true?");
if(answer == true)
{
	alert("I knew it was true!");
	// More true code...
}
else
{
	alert("Oh well, guess not then...");
	// More false code...
}

if...else...if

Using nested if statements, we can create some pretty advanced logic:

var age = prompt("What's your age?");
if(age < 1)
	alert("Infant");
else if(age < 13)
		alert("Child");
	else if(age < 18)
		alert("Teenager");
	else
		alert("Adult");

If you want or need to, you can of course use blocks around the conditions, just like we saw in previous examples.

Summary

The if statement is easy to use and understand, yet so powerful. If you're new to the world of programming, you might be surprised when you realize just how common they are. You should also know that there's an alternative, shorter notation for doing if...else statements, but we'll discuss that in the chapter on operators. For now, let's move on to some of the more advanced control structures.


This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!