ActionScript 3.0 and Math
This chapter is from the book
This chapter is from the book
This chapter is from the book
)
ActionScript has tons of mathematical operators built in to the language to help you evaluate mathematical equations. Now, I wouldn't throw away your handheld calculator just yet. ActionScript has a lot of power, but it's designed to help with your applications, not for general use. In addition to these mathematical operators, there are some functions that can help with common mathematical tasks like rounding numbers.
In this section, you'll learn all the basic arithmetic operators that you'll use in ActionScript. Also, there are some convenient shortcuts to make working with math easier that you'll cover as well.
Mathematical Operators
In ActionScript, you can use simple math operators to perform arithmetic functions with your numbers or variables. The math functions that are part of ActionScript are nearly identical to basic math functions that you already know. Some of the symbols and names are different, but the principles are the same.
Addition and Subtraction
Let's get started with adding and subtracting numbers.
- Create a new ActionScript 3.0 project in Flash Professional CS5.5 and enter the following code into the timeline:
// Math operators: addition and subtraction trace ( 2 + 3 ); trace ( 3 - 2 );
- Run the project and look at the Output panel; you'll see the following:
5 1
This shouldn't be surprising, since you are adding and subtracting the numbers. You use the + and – operators to indicate that you are adding or subtracting. One thing to note is the white-space characters used in the example. Notice the spaces between the operators and the numbers. This is for readability and doesn't affect the execution of the code. You can remove the spaces if you want, for example:trace ( 2 + 3 ); trace (2+3);
These two lines perform exactly the same function and will generate the same result.
Addition or Concatenation?
In the previous chapter, you used the + sign, but it wasn't a mathematical operator. You can use the + operator to do two things. When working with strings, the + operator is called the concatenation operator and takes two strings and combines them together, in essence gluing the end of one string to the beginning of the next. When working with numbers, the + operator is the addition mathematical operator, adding two numeric values together and generating a new numeric result.
Look at the following example.
- Remove the existing code and enter the following code:
// Addition vs. Concatenation trace ( 2 + 2 ); // addition trace ( "two" + "two" ); // concatenation trace ( "2" + "2" ); // concatenation
- Run this code; you'll see the following displayed in the Output panel:
4 twotwo 22
The first line of code in the example is pretty simple; you are adding the numbers 2 and 2 using the addition operator, resulting in a value of 4.The second line of code has two strings, denoted by quotation marks, that are being "glued" together, creating a single string using the string concatenation operator. The result is "twotwo."
The last line uses the number 2 on both sides of the operator. Notice that the numbers are surrounded by quotation marks, which means that it is no longer a number value, but instead the character 2. When you force the number 2 to be a string using quotation marks, the + operator concatenates the strings, "gluing" them together forming the string, 22.
What makes this confusing is that the Output panel doesn't distinguish between strings and numbers. So, when you see 22 in the Output panel, is it a number or a string? There is a way to find out the type of a value and display it: by using the typeof statement. - To see how typeof works, update the previous example as follows:
// Addition vs. Concatenation trace ( typeof (2 + 2) ) ; // addition trace ( typeof ("two" + "two") ) ; // concatenation trace ( typeof ("2" + "2") ) ; // concatenation - Run this updated example; you'll see the following in the Output panel:
number string string
What is happening is that the operation (either addition or concatenation) is taking place, and the typeof statement is determining the type of the result and then sending that to the Output panel via the trace statement.Now for one final twist. If you mix up the number and string types, what happens?
- Replace the existing code with the following:
trace ( 2 + "2" );
Wow. Now you have a number on the left side, and a string on the right side. Who wins? - Run the project.
The answer is that the string wins. The result is the string, "22". In this case the operator converts the number 2 to the string "2" and then "glues" it to the right "2" creating the string "22". It seems confusing at first, but after you work with it a while, it will become second nature to you—promise!
Multiplication and Division
Now, look at the * and / operators for multiplication and division.
- Replace the code in the timeline with the following:
// Math operators: Multiplication and Division trace ( 2 * 3 ); trace ( 5 / 2 );
The first statement uses the multiplication operator, which is an asterisk, *. The division operator is a forward slash, /, and the order of the division is that it divides the value on the left by the value on the right. - Run the project; you'll see the following in the Output panel:
6 2.5
Again, pretty simple stuff—but the next one will probably be new to you.
Modulo, the Operator Formerly Known as Long Division with Remainders
The modulo operator finds the remainder after a division operation. The modulo is quite helpful in many situations, including determining if a number is odd or even. Take a look at how it works.
- Replace the code you have with the following, and take a look at the output:
// Math operators: Modulo trace ( 5 % 2 );
- Run the project; you'll see the following displayed in the Output panel:
1
The % symbol invokes the modulo operator, finding the remainder after attempting a division of the value on the left with the value on the right. In this example, it divides 5 by 2, resulting in 2 and a remainder of 1. To see this written out in long division format, check out Figure 4.1.
Figure 4.1 5 divided by 2 written in long division format, showing the remainder, or modulo.
)