元组:固定长度的类型化数组
为具有确定位置的结构化数据定义元组。
第 3 / 4 课13 个步骤
元组:固定长度的类型化数组 是 CoddyKit 上的免费 TypeScript Academy 课时。 这是第 3 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 TypeScript Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。
欢迎
元组是元素数量固定的数组,其中每个位置都有特定类型。它们非常适合表示坐标或键值对等结构化数据。
定义元组
元组类型按顺序列出每个元素的类型。长度是固定的,每个位置都必须保存声明的类型。
const point: [number, number] = [10, 20];
const entry: [string, number] = ['age', 25];访问元组元素
通过索引访问元组元素。TypeScript 知道每个位置的类型。
const pair: [string, number] = ['Alice', 30];
const name: string = pair[0]; // string
const age: number = pair[1]; // number元组解构
解构元组时,每个变量都会根据其位置获得明确的推断类型。
const [x, y]: [number, number] = [5, 10];
console.log(x + y); // 15元组与数组
数组包含数量可变且类型相同的元素。元组包含数量固定、类型可能不同且位置明确的元素。
const arr: number[] = [1, 2, 3, 4]; // variable length
const tup: [number, string] = [1, 'a']; // fixed: 2 elements可选元组元素
使用 `?` 将元组元素标记为可选。可选元素必须位于必需元素之后。
type Named = [string, string?]; // name, optional nickname
const a: Named = ['Alice'];
const b: Named = ['Bob', 'Bobby'];元组中的剩余元素
元组可以包含剩余元素,用于捕获数量可变、类型特定的末尾元素。
type StringAndNumbers = [string, ...number[]];
const data: StringAndNumbers = ['scores', 90, 85, 78];带标签的元组元素
TypeScript 4.0 新增了带标签的元组元素。标签可以提高可读性,但不会影响类型系统。
type Range = [start: number, end: number];
const r: Range = [0, 100];只读元组
添加 `readonly`,可以防止元组创建后被修改。
const origin: readonly [number, number] = [0, 0];
// origin[0] = 5; // Error作为函数返回值的元组
从函数返回元组是 React 钩子和工具函数中常用的模式,用于返回多个具有不同类型的值。
function useCounter(): [number, () => void] {
let count = 0;
return [count, () => { count++; }];
}使用常量断言推断元组
不使用 `as const` 时,元组字面量可能会被扩宽为数组类型。使用 `as const` 可以推断出精确的元组类型。
const pair = [1, 'hello'] as const;
// type: readonly [1, 'hello'] — not (number | string)[]快速检查
没有任何类型注解时,TypeScript 会为 `const t = [1, 'hello']` 推断出什么类型?
回顾
元组定义了长度固定且各位置具有类型的数组。您可以使用元组表示坐标、键值对和返回多个值的函数。添加只读修饰符可以防止修改,使用常量断言可以推断出字面量元组类型。
免费开始
用 AI 导师学习 TypeScript — 免费
在浏览器中编写并运行真实代码,获得全天候 AI 导师的即时帮助,并在网页或应用中继续学习。
- 课程
- 101
- 课程
- 352
常见问题解答
「元组:固定长度的类型化数组」课时是免费的吗?
是的 — 「元组:固定长度的类型化数组」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 TypeScript Academy 课程的其余内容,请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。
「元组:固定长度的类型化数组」这节课中我会学到什么?
为具有确定位置的结构化数据定义元组。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 TypeScript Academy 需要有经验吗?
无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 3 节课,共 4 节。
「元组:固定长度的类型化数组」课时需要多长时间?
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。
我能在这节 TypeScript Academy 课中编写并运行代码吗?
能。每节 TypeScript Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。
此课程中的所有课时
- 类型化数组:T[] 与 Array
- Readonly 数组与不可变数据
- 元组:固定长度的类型化数组
- 枚举:数值常量与字符串常量