Тип кортежа TypeScript — Tuple с примерами

В этом руководстве вы узнаете о типе кортежа TypeScript Tuple и его использовании.

Введение в тип TypeScript Tuple

Кортеж работает как массив Typescript с некоторыми дополнительными соображениями:

• Количество элементов в кортеже фиксировано.
• Типы элементов известны и могут не совпадать.

Например, вы можете использовать кортеж для представления значения в виде пары string и number :

let skill: [string, number];
skill = ['Programming', 5];

Порядок значений в кортеже важен. Если вы измените порядок значений кортежа skill на [5, "Programming"], вы получите сообщение об ошибке:

let skill: [string, number];
skill = [5, 'Programming'];

Ошибка:

error TS2322: Type 'string' is not assignable to type 'number'.

По этой причине рекомендуется использовать кортежи с данными, которые связаны друг с другом в определенном порядке.

Например, вы можете использовать кортеж для определения цвета RGB, который всегда представлен шаблоном из трех чисел:

(r,g,b)

Например:

let color: [number, number, number] = [255, 0, 0];

color[0], color[1] и color[2] логически сопоставляются со значениями цвета Red, Green и Blue.

Дополнительные элементы кортежа

Начиная с TypeScript 3.0, кортеж может иметь необязательные элементы, указанные с помощью постфикса вопросительного знака(?).

Например, вы можете определить кортеж RGBA с дополнительным значением альфа-канала:

let bgColor, headerColor: [number, number, number, number?];
bgColor = [0, 255, 255, 0.5];
headerColor = [0, 255, 255];

Обратите внимание, что RGBA определяет цвета, используя красную, зеленую, синюю и альфа-модель. Альфа определяет непрозрачность цвета.

• Кортеж в Typescript — это массив с фиксированным количеством элементов, типы которых известны.