TypeScript 元组
最后修改时间：2025年3月3日
TypeScript 中的元组是具有特定类型元素的固定长度数组。它们允许您定义一个数组，其中每个元素的类型都是已知的。本教程将探讨元组语法、类型注解和实际示例。
基本元组语法
元组是通过在方括号中指定其元素的类型来定义的。此示例显示了一个包含字符串和数字的简单元组。
basic_tuple.ts
let user: [string, number] = ["Alice", 25]; console.log(user[0]); // Output: Alice console.log(user[1]); // Output: 25
user 元组包含一个字符串和一个数字。TypeScript 会强制执行元素的类型和顺序。
访问元组元素
元组元素通过索引访问，与数组类似。TypeScript 可确保访问元素时的类型安全。
access_tuple.ts
let point: [number, number] = [10, 20];
let x = point[0];
let y = point[1];
console.log(`X: ${x}, Y: ${y}`); // Output: X: 10, Y: 20
修改元组元素
元组元素可以被修改，但新值必须与元素类型匹配。此示例更新了一个元组元素。
modify_tuple.ts
let person: [string, number] = ["Bob", 30]; person[1] = 35; console.log(person); // Output: ["Bob", 35]
带可选元素的元组
元组可以使用 ? 符号包含可选元素。可选元素必须跟在必需元素之后。
optional_tuple.ts
let employee: [string, number, string?] = ["John", 40]; employee[2] = "Manager"; console.log(employee); // Output: ["John", 40, "Manager"]
带剩余元素的元组
元组可以包含剩余元素来捕获其他值。剩余元素必须是特定类型。
rest_tuple.ts
let scores: [string, ...number[]] = ["Math", 85, 90, 95]; console.log(scores); // Output: ["Math", 85, 90, 95]
元组作为函数返回类型
函数可以返回元组来分组多个值。此示例返回一个包含字符串和数字的元组。
return_tuple.ts
function getUser(): [string, number] {
return ["Alice", 25];
}
let [name, age] = getUser();
console.log(`Name: ${name}, Age: ${age}`); // Output: Name: Alice, Age: 25
带只读元素的元组
元组可以包含只读元素以防止修改。此示例使用了 readonly 修饰符。
readonly_tuple.ts
let config: readonly [string, number] = ["localhost", 8080]; // config[1] = 3000; // Error: Cannot assign to '1' because it is a read-only property. console.log(config); // Output: ["localhost", 8080]
带混合类型的元组
元组可以包含不同类型的元素。此示例混合了字符串、数字和布尔值类型。
mixed_tuple.ts
let data: [string, number, boolean] = ["Alice", 25, true]; console.log(data); // Output: ["Alice", 25, true]
带默认值的元组
元组可以用默认值初始化。此示例为元组设置了默认值。
default_tuple.ts
let settings: [string, number] = ["localhost", 8080]; console.log(settings); // Output: ["localhost", 8080]
元组解构
元组可以解构为单独的变量。此示例将元组元素提取到单独的变量中。
destructure_tuple.ts
let point: [number, number] = [10, 20];
let [x, y] = point;
console.log(`X: ${x}, Y: ${y}`); // Output: X: 10, Y: 20
最佳实践
- 谨慎使用元组：对于复杂数据，请优先使用对象。
- 类型安全：确保元组元素与其类型匹配。
- 只读元组：对不可变数据使用只读。
- 解构：使用解构简化元组访问。
- 文档：记录元组用法以提高清晰度。
来源
本教程通过实际示例介绍了 TypeScript 元组。有效地使用元组来组织固定长度、类型化的数据。