TypeScript-类型注解知识点详解
类型注解是 TypeScript 的核心特性之一,它允许开发者为变量、函数参数和返回值等指定类型。以下是类型注解的一些关键知识点:
1. 基本类型注解
在 TypeScript 中,你可以为变量指定基本类型:
let isDone: boolean = false;
let decimal: number = 6;
let name: string = "Kimi";
let list: number[] = [1, 2, 3]; // 数组类型注解
let x: [string, number] = ["Kimi", 10]; // 元组类型注解
2. 复杂类型注解
除了基本类型,TypeScript 还支持更复杂的类型注解,如联合类型、交叉类型、类型别名和接口:
// 联合类型
let id: number | string = "Kimi";// 交叉类型
let data: { id: number } & { name: string } = { id: 1, name: "Kimi" };// 类型别名
type PersonType = {name: string;age: number;
};let bob: PersonType = {name: "Bob",age: 25,
};// 接口
interface PersonInterface {name: string;age: number;
}let tom: PersonInterface = {name: "Tom",age: 30,
};
3. 可选属性和只读属性
你可以使用 ?
来标记一个属性为可选的,使用 readonly
来标记一个属性为只读的:
interface Person {readonly id: number;name?: string;
}
4. 类型断言
类型断言用于告诉编译器你比它更了解一个变量的类型:
let value: any = "Kimi";
let strLength: number = (<string>value).length;
5. 类型守卫
类型守卫是一种在运行时检查变量类型的方式,它可以用来缩小变量可能的类型范围:
function printValue(value: string | number) {if (typeof value === "string") {console.log(value.toUpperCase());} else {console.log(value.toFixed(2));}
}
6. 索引签名
索引签名允许你为对象的属性提供一个类型,这个类型是按照索引签名来确定的:
interface StringArray {[index: number]: string;
}let myArray: StringArray;
myArray = ["Hello", "World", "TypeScript"];
7. 函数类型注解
函数的类型注解包括参数类型和返回值类型:
function greet(name: string): string {return "Hello, " + name;
}
8. 重载
函数重载允许你为同一个函数名定义多个函数类型:
function greet(person: Person): string;
function greet(person: string): string;
function greet(person: any): string {if (typeof person === "string") {return "Hello, " + person;} else {return "Hello, " + person.name;}
}
9. 类型推断
TypeScript 编译器会根据变量的初始化值来推断其类型,如果未指定类型注解:
let name = "Kimi"; // 类型推断为 string
10. 非空断言操作符
非空断言操作符 !
用于告诉 TypeScript 编译器,你确信一个变量不会是 null
或 undefined
:
let value: string | null = null;
value!.toUpperCase(); // 告诉编译器 value 不会是 null 或 undefined
类型注解是 TypeScript 的基础,它提供了一种方式来为变量和函数参数指定预期的类型,从而使得代码更加健壮和易于维护。通过使用类型注解,你可以在编译时捕捉到潜在的错误,而不是在运行时。