nunomira.com nunomira.com   tutorials
   
   

Understanding Conditionals

Conditionals are another basic, yet fundamental concept in action script and in any other programming language.
Conditionals are used daily in our lives:

  • "If it doesn't rain, I'll go to the beach."
  • "If it doesn't rain, I'll go to the beach, else I'll stay at home reading."

Action script, just like English, uses the same logic and even the same keywords:

The if statement:

if(condition){
 statements
}

The if statement tests whether the condition is true or false. If the condition is true, the statements are executed.
In this example, a simple comparison is tested:

var x = 5;
if (x == 5){
  trace("x is 5");
}
// outputs x is 5

Of course you can have a more complex expression tested:

var x = 0;
var y = 27;
if (x > 1 && x < 11 || y == 27) {
trace("correct!");
}
// outputs correct! because y is 27

In the previous examples, the statements are both executed, but there are situations when they aren't:

var x = 7;
if (x == 5) {
 trace("x=5");
}
// nothing happens

The else statement:

if (condition) {
 statements
}else{
 alternative statements
}

The else statement is an extension of an if statement, i.e., an else has to come after an if.
Once again, the condition is tested and, if it true, the statements are executed. Unlike before, now there is an alternative in case the condition is false: the alternative statements are executed.

var x = 7;
 if (x == 5) {
trace("x=5");
} else {
 trace("x is not 5");
}
// outputs x is not 5


var x = 17;
 if (x > 1 && x < 11) {
trace("x>1 and x<11");
} else {
 trace("x <= 1 or x >= 11");
}
// outputs x <= 1 or x >= 11

When an if else is used you have only two possibilities. It may not be exactly a black or white, but a black or non-black possibility.
Unlike a lonely if statement, an if else always triggers something, unless you don't use either the statements or the alternative statements:

var x = 0;
if (x == 5) {
} else {
 this.gotoAndPlay("home");
}
// nothing happens

But there are alternative ways of coding the same logic, using cleaner code:

var x = 0;
if (x != 5) {
 this.gotoAndPlay("home");
}

The else if statement:


if (condition 1) {
 statements
}else if(condition 2){
 alternative statements 1
}else if(condition 3){
 alternative statements 2
}else{
 alternative to all the other statements
}

Here I used two else if statements as example of the syntax. Of course this number may vary between 1 and n.
An important note is that the else statement is optional. This means that, if you use it and none of the conditions are met, the final alternative will be executed. In case the else is omitted, there is the possibility that no code is triggered.

In this example the second condition is met:

var x = 2;
if (x == 1) {
 this.gotoAndPlay("intro");
} else if (x == 2) {
 this.gotoAndPlay("info");
}
// the playhead goes to the frame labeled info

None of the conditions are met and the else is triggered:

var x = 0;
if (x == 1) {
 this.gotoAndPlay("intro");
} else if (x == 2) {
 this.gotoAndPlay("info");
} else {
 this.gotoAndPlay("home");
}
// the playhead goes to the frame labeled home

The else isn't used and nothing is triggered:

var x = 0;
if (x == 1) {
 this.gotoAndPlay("intro");
} else if (x == 2) {
 this.gotoAndPlay("info");
}
// nothing happens

The switch statement:

The switch statement is for Flash MX only. In Flash 5 the result that you seek could be accomplished with the use of else if. So, switch is an alternative. It may make your code cleaner and save you some writing.

switch (expression) {
case condition1 :
 statement1;
 break;

case condition2 :
 statement2;
 break;

default :
statement3;
}

Like in the else if statement above, you can use 1 or more case clauses. And both the default and the breaks are optional, depending on your goal.
The expression is compared with the different conditions. If the expression doesn't match the first case clause, the next is tested and so forth. If the default is run, i.e., none of the case clauses are matched, the last statement is executed. If a case clause is matched, and there is a break statement, none of the following case clauses are tested. A common mistake is forgetting to use the break statement.

var x = 2;
switch (x) {
case 1 :
 this.gotoAndPlay("intro");
break;
case 2 :
 this.gotoAndPlay("info");
break;
default :
 
this.gotoAndPlay("home");
}
// the playhead goes to the frame labeled info

Remember using break:

var x = 1;
switch (x) {
case 1 :
 this.gotoAndPlay("intro");
case 2 :
 this.gotoAndPlay("info");

}
// the playhead goes to the frame labeled info
// instead of going to the frame labeled intro as wanted

// because the break statement is missing

By omitting the break statement you can achieve an or logic. More than one condition is tested:

var x = 1;
switch (x) {
case 1 :
case 2 :
 trace("x is 1 or x is 2");
break;
default :
 trace("x is not 1 nor 2");
}
// outputs "x is 1 or x is 2"

The default statement is run:

var x = 0;
switch (x) {
case 1 :
 this.gotoAndPlay("intro");
break;
case 2 :
 this.gotoAndPlay("info");
break;
default :
 
this.gotoAndPlay("home");
}
// the playhead goes to the frame labeled home
// because none of the case clauses are matched

And you may omit the default statement intentionally:

var x = 0;
switch (x) {
case 1 :
 this.gotoAndPlay("intro");
break;
case 2 :
 this.gotoAndPlay("info");
break;
}
// nothing happens

You may also test more complex expressions other than a simple comparison. To achieve this the logic is a bit different.
If you want to test again if x > 1 and x < 11:

var x = 5;
switch (true) {
case (x > 1 && x < 11) :
 trace("x > 1 and x < 11");
break;
default :
 trace(x <= 1 or x > 11);
}
// outputs x > 1 and x < 11

 

Notes

conditional operator:

The if else statement has a short version:

condition ? statement : alternative statement;

This example checks whether x is even or odd:

var x = 5;
x % 2 == 0 ? trace("x is even") : trace("x is odd");

if and else if:

What's the difference between testing conditions using only if and using else if?
In an else if, if the condition is matched, the following conditions aren't tested.
Here's an example:

var x = 5;
if (x > 2) {
 trace("x>2");
}
if (x % 2 != 0) {
 trace("x is odd");
}
//outputs both x>2 and x is odd

if (x > 2) {
 trace("x>2");
} else if (x % 2 != 0) {
 trace("x is odd");
}
// outputs x>2, i.e., the second condition isn't tested
// because the first is matched

This may not be a very good example because the logic of using else if statements should be testing disjoint conditions, which doesn't happen here, but I guess this is the only way!

Booleans:

Like said in the very beginning, an if statement checks whether the condition is true or false.
What if the condition is a boolean itself?

Suppose you have a variable visited that tells if a section of the site has been visited or not.
visited is now true:

about_mc.visited = true;
if(about_mc.visited == true){
 trace("already visited");
}
// outputs already visited

// which is the same as:
if(about_mc.visited){
 trace("already visited");
}
// outputs already visited

This means that the == true can be omitted.
The same applies to the inequality operator: == false.
You have to convert the false to true by using the logic operator not !:

about_mc.visited = false;
if(!about_mc.visited){
 trace("not visited yet");
}
// outputs not visited yet

Comparison, assignment and logic operators:

Throughout this article you've come across a lot of operators: =, ==, !=, >, <, >=, <=, &&, ||.

The only assignment operator that I used: =, is here just as a warning.
It's a common mistake using = instead of ==:

var x = 0;
if (x = 1) {
 trace("x is 1");
}
// outputs x is 1
// which is obviously false according to what you want
// but it's true because an assignment is always true

So, to test for equality use ==.

In conditionals, comparison operators are always (well... most of the times) present. Here are some of them, and also, as a warning, the deprecated version (because it shouldn't be used in Flash 5 and MX)

  • ==, equality - deprecated: eq, =
  • !=, inequality - deprecated: ne, <>
  • >, >=, greater than, greater than or equal - deprecated: gt, ge
  • <, <=, less than, less than or equal - deprecated: lt, le

Logic operators are also very useful:

  • &&, and - deprecated: and
  • ||, or - deprecated: or

Nesting an if inside another if is done many times, but some of them an && would do the job:

if (x > 5) {
 if (x < 10) {
  // do something
 }
}


if (x > 5 && x < 10) {
 // do something
}

   
   
nunomira.com nunomira.com   tutorials