Typescript之类型总结大全
TypeScript 中的基本类型
TypeScript 的基本类型涵盖了 JavaScript 的原始类型,并添加了一些 TypeScript 特有的类型。
1. JavaScript 原始类型(Primitive Types)
这些是 JavaScript 原有的基本数据类型,TypeScript 为它们提供了类型注解。
boolean - 布尔值
let isDone: boolean = true;
let isLoading: boolean = false;
number - 数字
TypeScript 中的所有数字都是浮点数,支持十进制、十六进制、二进制和八进制。
let decimal: number = 6;
let hex: number = 0xf00d; // 十六进制
let binary: number = 0b1010; // 二进制
let octal: number = 0o744; // 八进制
let float: number = 3.14;
let infinity: number = Infinity;
let notANumber: number = NaN;
string - 字符串
let name: string = "张三";
let sentence: string = `你好,${name}!`; // 模板字符串
bigint - 大整数(ES2020+)
表示大于 2^53 - 1 的整数。
let big: bigint = 9007199254740991n;
let big2: bigint = BigInt(9007199254740991);
symbol - 符号(ES2015+)
创建唯一的标识符。
typescript
let sym1: symbol = Symbol();
let sym2: symbol = Symbol("description");
2. 特殊原始类型
null - 空值
let n: null = null;
undefined - 未定义
let u: undefined = undefined;
注意:在 strictNullChecks 模式下,null 和 undefined 只能赋值给它们自己或 any 类型。
3. TypeScript 特有类型
any - 任意类型
关闭类型检查,兼容所有类型。
let notSure: any = 4;
notSure = "可能是字符串";
notSure = false; // 没问题
unknown - 未知类型
比 any 更安全的类型,使用时需要类型检查或断言。
let value: unknown;
// 需要类型检查后才能使用
if (typeof value === "string") {
console.log(value.length);
}
// 或使用类型断言
let str: string = (value as string);
void - 空类型
表示函数没有返回值。
function warnUser(): void {
console.log("警告信息");
// 没有 return 语句
}
never - 永不存在的值
表示永远不会发生的类型,用于总是抛出异常或无限循环的函数。
// 抛出错误
function error(message: string): never {
throw new Error(message);
}
// 无限循环
function infiniteLoop(): never {
while (true) {}
}
object - 非原始类型
表示非原始类型的值(不是 number, string, boolean, symbol, null, undefined)。
let obj: object = {};
let arr: object = [];
let func: object = function() {};
4. 数组类型
有两种表示方式:
类型 + 方括号
let list: number[] = [1, 2, 3];
let strings: string[] = ["a", "b", "c"];
泛型 Array<类型>
let list: Array<number> = [1, 2, 3];
let strings: Array<string> = ["a", "b", "c"];
只读数组
let readonlyArr: ReadonlyArray<number> = [1, 2, 3];
// readonlyArr.push(4); // ❌ 错误:只读数组不能修改
5. 元组(Tuple)
表示已知元素数量和类型的数组。
// 定义元组类型
let tuple: [string, number];
tuple = ["hello", 10]; // ✅ 正确
// tuple = [10, "hello"]; // ❌ 错误:类型不匹配
// 访问元组元素
console.log(tuple[0].substring(1)); // "ello"
console.log(tuple[1].toFixed(2)); // "10.00"
// 可选元素(3.0+)
let optionalTuple: [string, number?];
optionalTuple = ["hello"]; // ✅ 正确
optionalTuple = ["hello", 42]; // ✅ 正确
// 剩余元素
let restTuple: [string, ...number[]];
restTuple = ["hello", 1, 2, 3]; // ✅ 正确
6. 枚举(Enum)
数字枚举
enum Direction {
Up = 1, // 从 1 开始
Down, // 自动递增为 2
Left, // 3
Right // 4
}
let dir: Direction = Direction.Up;
字符串枚举
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT"
}
常量枚举(编译时完全删除)
const enum Colors {
Red,
Green,
Blue
}
let color = Colors.Red; // 编译后:let color = 0;
7. 字面量类型
字符串字面量
type EventType = "click" | "scroll" | "mousemove";
let event: EventType = "click"; // ✅
// event = "hover"; // ❌ 错误
数字字面量
type DiceRoll = 1 | 2 | 3 | 4 | 5 | 6;
let roll: DiceRoll = 3; // ✅
// roll = 7; // ❌ 错误
布尔字面量
type Truthy = true;
let isTrue: Truthy = true;
// isTrue = false; // ❌ 错误
8. 类型推断与联合类型
类型推断
let x = 3; // x 被推断为 number
let y = "hello"; // y 被推断为 string
联合类型
let id: string | number;
id = "abc123"; // ✅
id = 123; // ✅
// id = true; // ❌ 错误
// 类型守卫
if (typeof id === "string") {
console.log(id.toUpperCase());
} else {
console.log(id.toFixed(2));
}
9. 类型别名
// 基本类型别名
type ID = string | number;
type Point = {
x: number;
y: number;
};
let userId: ID = "user-123";
let position: Point = { x: 10, y: 20 };
类型总结表
| 类型 | 示例 | 描述 |
|---|---|---|
boolean |
let isDone: boolean = true; |
布尔值 |
number |
let count: number = 10; |
所有数字类型 |
string |
let name: string = "John"; |
字符串 |
bigint |
let big: bigint = 100n; |
大整数 |
symbol |
let sym: symbol = Symbol(); |
唯一标识符 |
null |
let n: null = null; |
空值 |
undefined |
let u: undefined = undefined; |
未定义 |
any |
let anything: any = 4; |
任意类型 |
unknown |
let unsure: unknown = 30; |
未知类型 |
void |
function(): void {} |
无返回值 |
never |
function error(): never {} |
永不存在的值 |
object |
let obj: object = {}; |
非原始类型 |
Array<T> |
let list: number[] = [1, 2, 3]; |
数组 |
[T1, T2] |
let tuple: [string, number]; |
元组 |
enum |
enum Color { Red, Green } |
枚举 |
实用示例
// 完整示例
function processInput(input: string | number | boolean): string {
if (typeof input === "string") {
return `字符串: ${input.toUpperCase()}`;
} else if (typeof input === "number") {
return `数字: ${input.toFixed(2)}`;
} else {
return `布尔值: ${input}`;
}
}
// 严格空值检查
function greet(name: string | null): string {
if (name === null) {
return "你好,访客!";
}
return `你好,${name}!`;
}
// 使用 never 进行穷尽检查
type Shape = "circle" | "square" | "triangle";
function getArea(shape: Shape): number {
switch (shape) {
case "circle":
return Math.PI;
case "square":
return 1;
case "triangle":
return 0.5;
default:
// 确保处理了所有情况
const _exhaustiveCheck: never = shape;
return _exhaustiveCheck;
}
}
TypeScript 的基本类型系统提供了强大的类型安全保证,帮助开发者在编译时捕获错误,提高代码质量。