TypeScript 是 JavaScript 的一个超集,它通过添加静态类型系统来增强 JavaScript 的能力。掌握 TypeScript 的类型系统对于构建健壮、可维护的代码至关重要。以下是一些关键概念和最佳实践,帮助你更好地利用 TypeScript 的类型系统。

一、基本类型

TypeScript 提供了多种基本类型,包括:

  • number:表示数字。
  • string:表示字符串。
  • boolean:表示布尔值。
  • null 和 undefined:表示空值。
  • any:表示任何类型。
let age: number = 30;
let name: string = "Alice";
let isStudent: boolean = true;
let ageUndefined: undefined;
let anyType: any = "I can be anything!";

二、联合类型和类型别名

联合类型允许一个变量表示多个类型中的一个。类型别名用于给一个类型起一个新名字。

// 联合类型
let id: number | string;

// 类型别名
type ID = number | string;
let idType: ID = 123;
let idString: ID = "456";

三、接口(Interfaces)

接口定义了一个对象的结构,可以用来描述一个类的形状。

interface Person {
  name: string;
  age: number;
}

function introduce(person: Person): void {
  console.log(`My name is ${person.name} and I am ${person.age} years old.`);
}

const person: Person = { name: "Alice", age: 30 };
introduce(person);

四、类(Classes)

类用于创建对象,它包含属性和方法。

class Animal {
  constructor(public name: string) {}

  makeSound(): void {
    console.log(`${this.name} makes a sound.`);
  }
}

const dog = new Animal("Dog");
dog.makeSound();

五、泛型

泛型允许你在定义函数、接口或类时,不指定具体的类型,而是在使用时再指定。

function identity<T>(arg: T): T {
  return arg;
}

const result = identity<string>("Hello, TypeScript!");

六、枚举(Enums)

枚举用于定义一组常量。

enum Color {
  Red,
  Green,
  Blue
}

const favoriteColor = Color.Red;
console.log(favoriteColor); // 输出:0

七、类型守卫

类型守卫用于在运行时检查变量类型。

function isNumber(value: any): value is number {
  return typeof value === "number";
}

const num = 10;
if (isNumber(num)) {
  console.log(num.toFixed(2)); // 输出:10.00
}

八、高级类型

TypeScript 还提供了许多高级类型,如键类型、映射类型、条件类型等。

type PersonType = {
  [key: string]: any;
}

type PersonKeys = keyof PersonType;

function getPersonProperty<T extends PersonType, K extends keyof T>(person: T, key: K): T[K] {
  return person[key];
}

const person: PersonType = { name: "Alice", age: 30 };
const name = getPersonProperty(person, "name");

总结

TypeScript 的类型系统功能强大,可以帮助你构建更健壮、更易于维护的代码。通过理解并运用这些类型系统,你可以写出更加清晰、安全的代码。