TypeScript 元组

摘要：在本教程中，您将学习 TypeScript 元组类型及其用法。

TypeScript 元组类型简介

元组类似于 数组，但也有一些额外的考虑因素。

• 元组中元素的数量是固定的。
• 元素的类型是已知的，并且不必相同。

例如，您可以使用元组来表示一个值，该值由一个 string 和一个 number 组成。

let skill: [string, number];
skill = ['Programming', 5];Code language: TypeScript (typescript)

元组中值的顺序很重要。如果您将 skill 元组的值顺序更改为 [5, "Programming"]，则会收到错误。

let skill: [string, number];
skill = [5, 'Programming'];Code language: TypeScript (typescript)

错误

error TS2322: Type 'string' is not assignable to type 'number'.Code language: JavaScript (javascript)

因此，最好将元组用于以特定顺序相互关联的数据。

例如，您可以使用元组定义 RGB 颜色，该颜色始终以三个数字模式出现。

(r,g,b)

例如

let color: [number, number, number] = [255, 0, 0];Code language: JavaScript (javascript)

color[0]、color[1] 和 color[2] 将在逻辑上映射到 Red、Green 和 Blue 颜色值。

可选元组元素

从 TypeScript 3.0 开始，元组可以使用问号 (?) 后缀指定可选元素。

例如，您可以使用可选的 alpha 通道值定义 RGBA 元组。

let bgColor, headerColor: [number, number, number, number?];
bgColor = [0, 255, 255, 0.5];
headerColor = [0, 255, 255];Code language: JavaScript (javascript)

请注意，RGBA 使用红色、绿色、蓝色和 alpha 模型定义颜色。alpha 指定颜色的不透明度。

总结

• 元组是具有固定数量元素的数组，这些元素的类型是已知的。