TypeScript 类与泛型的使用实践

介绍

TypeScript是一种由Microsoft开发的开源编程语言，它是JavaScript的一个超集，为JavaScript添加了静态类型支持。TypeScript提供了更强大的面向对象编程能力，其中类和泛型是其核心特性之一。在本篇笔记中，我将记录我在使用TypeScript类和泛型时的实践经验，包括一些常见的用法和技巧。

类的基本定义和使用

类是面向对象编程中的基本概念，它是一种数据结构，用于封装数据和相关的操作。在TypeScript中，我们可以使用class关键字来定义一个类。

class Person {
  name: string;
  age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  greet() {
    return `Hello, my name is ${this.name} and I am ${this.age} years old.`;
  }
}

const john = new Person('John', 30);
console.log(john.greet()); // Output: "Hello, my name is John and I am 30 years old."

在上面的例子中，我们定义了一个名为Person的类，它有两个属性name和age，以及一个greet方法用于打招呼。通过new关键字，我们创建了一个Person类的实例john，并调用了greet方法。

类的继承和方法重写

TypeScript支持类的继承，我们可以使用extends关键字来实现子类继承父类的属性和方法。同时，我们也可以在子类中重写父类的方法。

class Student extends Person {
  school: string;

  constructor(name: string, age: number, school: string) {
    super(name, age);
    this.school = school;
  }

  greet() {
    return `${super.greet()} I am a student at ${this.school}.`;
  }
}

const mary = new Student('Mary', 25, 'XYZ University');
console.log(mary.greet()); // Output: "Hello, my name is Mary and I am 25 years old. I am a student at XYZ University."

在上面的例子中，我们定义了一个Student类，它继承了Person类，并增加了一个school属性。在Student类中，我们重写了greet方法，但通过super.greet()调用了父类Person的greet方法，以便在打招呼中保留父类的信息。

泛型的基本概念和使用

泛型是一种在编程中创建可复用代码的技术，它允许我们在定义类、函数或接口时使用占位符类型，这些类型在使用时才会被具体指定。在TypeScript中，我们可以使用尖括号<>来定义泛型类型。

泛型函数

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

console.log(echo<number>(42)); // Output: 42
console.log(echo<string>('Hello')); // Output: "Hello"

在上面的例子中，我们定义了一个泛型函数echo，它接受一个参数arg并返回该参数。通过使用尖括号指定泛型类型，我们可以在调用函数时传入不同类型的参数。

泛型类

class Box<T> {
  value: T;

  constructor(value: T) {
    this.value = value;
  }
}

const numberBox = new Box<number>(42);
const stringBox = new Box<string>('TypeScript');

console.log(numberBox.value); // Output: 42
console.log(stringBox.value); // Output: "TypeScript"

在上面的例子中，我们定义了一个泛型类Box，它有一个属性value，并在构造函数中接受泛型类型的值。通过使用尖括号指定泛型类型，我们可以创建不同类型的Box实例。

泛型约束

有时候，我们希望对泛型进行一些限制，以确保泛型类型具有特定的行为或属性。这时候，我们可以使用泛型约束。

interface Lengthy {
  length: number;
}

function getLength<T extends Lengthy>(arg: T): number {
  return arg.length;
}

console.log(getLength('Hello')); // Output: 5
console.log(getLength([1, 2, 3, 4, 5])); // Output: 5

在上面的例子中，我们定义了一个Lengthy接口，它要求对象具有length属性。然后，我们定义了一个泛型函数getLength，它的泛型类型被约束为实现了Lengthy接口的类型。这样，我们可以确保传入的参数具有length属性，并返回它的长度。

结论

TypeScript的类和泛型是非常有用的特性，它们可以帮助我们编写更可靠、可复用的代码。通过类的继承，我们可以建立类之间的层次结构，从而更好地组织代码。而泛型则允许我们创建通用的函数和类，以处理不同类型的数据，增强了代码的灵活性和可维护性。在实践中，我们可以根据具体的需求灵活地运用这些特性，以达到更高效的编程目标。

TypeScript 类、泛型的使用实践记录 笔记 ｜ 青训营