The Language of Expressions
JavaScript 101
Well, it was bound to happen sooner or later. We've got to talk about programing and math concepts. After Effects' expression language is based on the programming language JavaScript, so if you're going to master expression writing, you've got to learn at least some of it. Fortunately, a lot of JavaScript is useful only for writing web pages so you only need to worry about the subset that is useful in After Effects. However, it can be hard to wrap your brain around it all unless you are willing to spend some time with it. I'm going to break up the JavaScript stuff so that I don't overwhelm you with all of it at once. My plan is to cover each piece as we need it to progress. Unfortunately, we need some now.
Learnin' the Lingo
First we need to talk a little about the lingo of JavaScript. JavaScript deals with objects, methods, and properties. In the context of After Effects, objects are things like layers, comps, and effects. Methods are actions (sometimes it's useful to think of them as verbs). Properties are attributes of objects (like the width of a layer or the frame duration of a comp). However, since After Effects already defined things like Position, Rotation, Opacity, and Scale as properties long before expressions came along, for our purposes here we will refer to what JavaScript calls "properties" as "attributes" to avoid confusion with After Effects' "properties".
Operator, Operand
JavaScript, as does any programming language, also contains operators. If you've done any programming at all you'll be familiar with at least some of these. The multiply operator is represented by "*". Addition is "+". Subtraction is "-". Division is "/". Multiplication and division happen before addition and subtraction. So, for example, the result of 3+2*5 would be 13 because first JavaScript would perform the 2*5 operation (resulting in 10) and then perform the 10+3 operation (resulting in 13). You can use parentheses to change the default order of operation. Using our previous example, (3+2)*5 would now give us 25 because the addition would happened before the multiplication.
While we're discussing JavaScript operators, we should look at the modulus operator ("%") which will be extremely useful in our expressions. This operator returns the remainder of a division operation. For example, the result of 5%3 would be 2 (the remainder of 5 divided by 3).The result of 7.7%2 would be 1.7
In your JavaScript wanderings, you'll undoubtedly encounter the term "operand". That's simply what operators operate on. For example, in this simple expression:
3*5
3 and 5 are operands and * (multiply) is the operator.
Variables
In multi-line expressions, you will often want to use variables. A variable in JavaScript is simply a temporary place with a name to store something. After you store something in a variable, you can retrieve it later by referencing the variable by name. (In fact, if you're not planning on retrieving it later, it doesn't make any sense to store it in the first place, does it?) For example, we might have a line in an expression like:
x = 10;
This statement would store the value of 10 into the variable named "x". Presumably we would refer to x later in the expression to retrieve the value stored there.
Statements
Many expressions in After Effects will consist of multiple "statements". Generally, each statement ends with a semi-colon. Many statements are "assignment" statements where you have a variable name on the left, an equals sign ("="), and then the value that gets plugged into the variable. There are some exceptions that we will cover as we get to them. One significant exception for After Effects is that the last statement of an expression is assumed to be an assignment operation to the property that the expression is written on. (Actually, it's the last statement executed in the expression, which in some cases won't necessarily be the last statement in the expression). This statement does not need to have a variable on the left, it doesn't need to have an assignment operator (=), and it doesn't need to end in a semi-colon. It just needs to have the value (or equation that will generate a value) that is the final result of the expression. For example, you could have this simple expression for Rotation:
180
After Effects will assume that what you meant is:
rotation = 180;
However, if you want to, you can in fact include a variable, an assignment operator and a semi-colon in the last statement and After Effects will still take the result and plug it into the property that you wrote the expression on. For example, if you had a Rotation expression that looked like this:
x = 10;
y = x*18;
After Effects would plug 180 in for the value of Rotation because that was the last result that it calculated.
 |
next  |