skip to Main Content

After Effects Expressions & JavaScript

variable

A variable can be thought of as a container you use to store information. You create a variable in After Effects by simply giving it a name and assigning it a value.

Give your variable a name

  • Start with a letter, dollar sign, or underscore, from there you can use numbers as well.
  • No symbols, spaces, or punctuation marks (except underscore and dollar sign).
  • It can be as long as you want.
  • All code in JavaScript, including variables, is case sensitive (e.g. frog ≠ Frog).
  • You can not use JavaScript reserved words, (if is a reserved word, however, If is not).

Give your variable a value
In JavaScript you declare a variable by proceeding it with var (that’s one of those reserved words, by the way), so if you wanted a variable named C to equal 12, it would look like this:

var C=12;
C
//The variable C returns: 12

The first line declares the variable and After Effects assigns the value 12 to C.

Because line 2 only contains the variable C, it assigns the value 12 to the property the expression is placed within.

Often when writing expressions in After Effects the var declaration is left out, so it would look like this:

C=12;
C
//The variable C returns: 12

You don’t need to give a variable a value when declaring a variable using var in JavaScript.  JavaScript will reserve the empty variable name to use later in the code. However, unlike other applications of JavaScript, expressions in After Effects live only in their own expression field and are not global. This means you have to declare every variable in your current script by attaching a property value, an expression control value, or a calculation result to it. Outside of a specific expression field the variables created within that field do not exist.

Types of variables

Besides containing a single value, such as 12 in the example above, variables can hold information such as:

String

A string within a variable refers to text, including numbers and spaces, that is identified by placing the string between quotation marks (“moose”) or single quote marks (‘moose’).

R="Fred"; //R contains the text: Fred
R="This is a string."; //R contains the text: This is a string.
R=12; //R contains the value: 12
R="12"; //R contains the string: 12, which After Effects will read as text or a value, depending on how the variable is used.

Array

Think of an array as an ordered list, separated by commas, within a variable, which can be composed of numbers, strings, or include both. Arrays can also contain arrays.

R=[12,13]; //R contains an array, which is read in order 12 then 13
R=["Fred","Bob","Jane","Mary"]; //R contains an array, which is read in order, Fred, Bob, Jane, Mary.
R=["Jane",42]; //You can mix strings and numbers in an array.
R=[[345,123],[453,982]]; //Arrays can hold arrays

Notice one of the examples above mixes a string and a number. If you place a string that contains letters in an expression that requires a number you’ll get an error. However, if the string only contains digits, then After Effects will read it as a number.

//EXAMPLE 1 
R=52; 
R 
//Returns 52 
//EXAMPLE 2 
R="52"; 
R 
//Returns 52 and will read it as a number if a number is required. 
//EXAMPLE 3 
R="fifty-two" 
R 
//Returns fifty-two and gives you an error if a number is required. 
//EXAMPLE 4 
fiftyTwo=52; //A variable cannot contain a space or a dash. 
R=fiftyTwo; //No quotation marks 
R 
//Returns 52 
//EXAMPLE 5 
fiftyTwo=52; 
R="fiftyTwo"; //Quotation marks 
R 
//Returns fiftyTwo and gives you an error if a number is required.

In the above examples, if R needed to be a number, say for the rotation property, then anytime the R did not return the digits 52 you would get in error.

Working with arrays

How adding and subtraction works with arrays 

Adding and subtracting with arrays is straight forward. The values are paired by their position within the array.

[6,3] + [3,1] = [9,4]

[6,3] – [3,1] = [3,2]

If the arrays don’t contain the same amount of values, the missing positions are ignored.

[6,3] + [3,1,8] = [9,4,8]

[6,3] – [3,1,8] = [3,2,8]

Identifying what part of an array you want to work with 

If you have an array within a variable, but just want to deal with a single piece of information you add a position number after the variable enclosed in brackets. Like frame counts, the first position is numbered 0, not 1.

P=[23,34,11]; //Assigned the variable P the array [23, 34, 11]
X=P[0]; //Assigned the variable X the first position in the variable, which is 23
Y=P[1]; //Assigned the variable Y the second position in the variable, which is 34
Z=P[2]; //Assigned the variable Z the third position in the variable, which is 11

To access an item within a variable holding an array you enclose its position number within brackets. Again, note that the first position is number 0, the second is number 1, and so on.

R=[[345,123],[453,982]]; //This array contains two arrays
T=R[1]; //T was assigned the second of R's two arrays [453,982]
B=T[0]; //B was assigned the first value of T's array 453
R=[[15,34],[76,90]]; // R is assigned two arrays: [15,34] and [76,90]
R[1][0] //R returns 76, the first brackets find which array is requested, the second which position in that array it should return
Back To Top