Collection types in TypeScript
The object types are all class, interface, array, and literal types (anything that isn't a primitive type.) For now, let's look at the array and Tuple types.
Arrays
TypeScript, like JavaScript, allows you to work with arrays. Arrays can be written in one of two ways. In the first, you use the type of the elements followed by square brackets ([ ]
) to denote an array of that element type:
let list: number[] = [1, 2, 3];
The second way uses a generic Array
type, using the syntax Array<type>
:
let list: Array<number> = [1, 2, 3];
There's no advantage to using one over the other, so it's up to you to decide which syntax to use.
Tuples
Having an array of the same value types is useful, but sometimes you have an array that contains values of mixed types. For that purpose, TypeScript provides the Tuple type. To declare a Tuple, use the syntax variableName: [type, type, ...]
.
Exercise - Tuples
Open the Playground and remove any existing code.
Enter the following code to create a Tuple that contains a
string
and anumber
:let person1: [string, number] = ['Marcia', 35];
Try to add another item to the array. For example:
let person1: [string, number] = ['Marcia', 35, true];
You'll note that an error is raised because the elements in the Tuple
array
are fixed. Theperson1
Tuple is an array that contains exactly onestring
value and onenumeric
value.Try switching the order of the items in the array. For example:
let person1: [string, number] = [35, 'Marcia'];
You'll get an error that indicates that the order of the values must match the order of the types.