Кортежи

Иногда в массиве фиксированное число элементов, и у каждого места свой смысл: позиция на карте — это [x, y], предмет с количеством — ["Стрела", 20]. Для таких массивов в TypeScript есть кортежи (tuples): типы, которые перечисляют тип каждого элемента по порядку:

const position: [number, number] = [3, 5];
const arrows: [string, number] = ["Стрела", 20];

console.log(`${arrows[0]} x${arrows[1]}, точка ${position[0]}, ${position[1]}`);

Вывод:

Стрела x20, точка 3, 5

[string, number] означает ровно два элемента: сначала строка, затем число. TypeScript знает тип каждого из них: arrows[0] — это string, а arrows[1] — number.

Тип кортежа нужно писать как аннотацию: по одним лишь значениям TypeScript кортеж не выводит. Из [3, 5] он выведет number[] — массив чисел любой длины. Из ["Стрела", 20] он выведет (string | number)[] — массив любой длины, элементы которого могут быть строками или числами в любом порядке. (| означает «или»; подробнее в уроке «Объединения и сужение типов».)

Порядок важен. Если значения поменять местами, TypeScript сообщит об обоих:

const potion: [string, number] = [2, "Лечебное зелье"];

main.ts(1,35): error TS2322: Type 'number' is not assignable to type 'string'.
main.ts(1,38): error TS2322: Type 'string' is not assignable to type 'number'.

Длина тоже фиксирована. У пары нет третьего элемента, поэтому TypeScript сообщает о попытке его прочитать:

const position: [number, number] = [3, 5];
console.log(position[2]);

main.ts(2,22): error TS2493: Tuple type '[number, number]' of length '2' has no element at index '2'.

В JavaScript position[2] молча оказалось бы undefined. Когда программа запускается, кортеж — это обычный массив JavaScript, и console.log(arrows) выводит ["Стрела", 20]. Тип кортежа лишь подсказывает TypeScript, что проверять.

Типичные ошибки:

• Лишний элемент в значении: const arrows: [string, number] = ["Стрела", 20, 5]; даёт сообщение на двух строках: Type '[string, number, number]' is not assignable to type '[string, number]'. и под ним Source has 3 element(s) but target allows only 2. Вторая строка объясняет первую.
• [number] вместо number[]: [number] — кортеж ровно из одного числа, а number[] — массив с любым количеством чисел.