TypeScript 作为 JavaScript 的一个超集,拥有强大的类型系统,这可以帮助开发者编写更加健壮、可维护的代码。本文将从 TypeScript 的基础类型开始,逐步深入到复杂泛型的使用,并提供实用的实践技巧,帮助你更好地掌握 TypeScript 类型系统,从而提升代码质量。
一、TypeScript 基础类型
TypeScript 提供了丰富的基础类型,包括:
1. 布尔型(Boolean)
let isDone: boolean = false;
2. 数字型(Number)
let count: number = 10;
3. 字符串型(String)
let message: string = "Hello, TypeScript!";
4. 字符型(Character)
let ch: char = 'a';
5. 任意类型(Any)
let notSure: any = 4;
notSure = "maybe a string instead";
6. 数组类型
let list: number[] = [1, 2, 3];
let list2: Array<number> = [1, 2, 3];
7. 元组类型(Tuple)
let x: [string, number];
x = ["hello", 10]; // OK
x = [10, "hello"]; // Error
8. 枚举(Enum)
enum Color { Red, Green, Blue };
let c: Color = Color.Green;
9. void 类型
function sayHello(): void {
console.log("Hello");
}
10. null 和 undefined
let u: undefined = undefined;
let n: null = null;
二、接口(Interface)
接口定义了类的结构,包括类的属性和方法,但不包含具体的实现。
interface Person {
name: string;
age: number;
}
function greet(person: Person): void {
console.log(`Hello, ${person.name}!`);
}
三、类(Class)
TypeScript 支持面向对象编程,类是面向对象的基本单位。
class Animal {
name: string;
constructor(name: string) {
this.name = name;
}
}
let a: Animal = new Animal("dog");
四、泛型(Generic)
泛型允许在定义函数、接口和类的时候不指定具体的类型,而是在使用的时候再指定。
1. 泛型函数
function identity<T>(arg: T): T {
return arg;
}
2. 泛型接口
interface GenericIdentityFn<T> {
<U>(arg: U): T;
}
function identityFn<T, U>(arg: U): T {
return arg;
}
3. 泛型类
class GenericNumber<T> {
zeroValue: T;
add: (x: T, y: T) => T;
}
let myGenericNumber = new GenericNumber<number>();
myGenericNumber.zeroValue = 0;
myGenericNumber.add = function(x, y) { return x + y; };
五、高级泛型
1. 高阶泛型
高阶泛型指的是泛型本身是泛型的类型。
function identity<T>(arg: T): T {
return arg;
}
function logIdentity<T>(arg: T): T {
console.log(arg);
return arg;
}
// 高阶泛型函数
function identityFn<T, U>(arg: U): T {
return arg;
}
2. 可变泛型
可变泛型允许在泛型类型中使用索引访问操作符([key: number])。
interface GenericArray<T> {
[index: number]: T;
}
3. 约束泛型
约束泛型可以限制泛型参数的类型。
function identity<T extends number | string>(arg: T): T {
return arg;
}
4. 空泛型
空泛型允许在泛型参数中使用空对象({})。
function identity<T = {}>(arg: T): T {
return arg;
}
六、总结
TypeScript 的类型系统可以帮助开发者编写更加健壮、可维护的代码。通过本文的学习,你应该已经掌握了 TypeScript 的基础类型、接口、类、泛型等概念,并能够将这些知识应用到实际项目中。不断实践和探索,相信你会成为一名 TypeScript 高手。
