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

天琴
58 阅读2分钟

TypeScript中的泛型是一种强大的工具，它允许您编写更灵活、可重用的代码。使用泛型，您可以编写适用于不同类型的函数和类，同时保持类型安全性。

下面是一些使用TypeScript泛型的实践记录和示例：

  1. 函数泛型：
typescriptCopy Code
function identity<T>(arg: T): T {
    return arg;
}

let result = identity<string>("Hello");
console.log(result); // 输出：Hello

// 类型推断
let result2 = identity(10);
console.log(result2); // 输出：10

在上述示例中，identity 函数使用了泛型类型参数 T，它可以代表任意类型。这使得函数可以接受不同类型的参数，并将其返回，保持了灵活性。通过明确指定类型参数（如 identity<string>("Hello")），或者让编译器根据上下文进行类型推断（如 identity(10)），我们可以使用该函数来处理不同类型的值。

  1. 类泛型：
typescriptCopy Code
class ArrayWrapper<T> {
    private array: T[];

    constructor() {
        this.array = [];
    }

    addItem(item: T) {
        this.array.push(item);
    }

    getItems(): T[] {
        return this.array;
    }
}

let stringArray = new ArrayWrapper<string>();
stringArray.addItem("Apple");
stringArray.addItem("Banana");
let items = stringArray.getItems();
console.log(items); // 输出：["Apple", "Banana"]

在这个示例中，ArrayWrapper 类使用泛型类型参数 T 来创建一个可以存储任意类型的数组。我们可以通过使用不同的类型参数来创建多个实例，从而使得该类更加通用和灵活。在示例中，我们创建了一个 ArrayWrapper<string> 的实例并向其中添加了两个字符串，然后获取所有项并打印出来。

  1. 类型约束： 有时候，我们希望对泛型进行更严格的控制，以确保某些属性或方法在使用泛型类型时可用。这可以通过使用类型约束来实现。
typescriptCopy Code
interface Lengthwise {
    length: number;
}

function logLength<T extends Lengthwise>(arg: T): void {
    console.log(arg.length);
}

let obj = { length: 5, value: "Hello" };
logLength(obj); // 输出：5

在上述示例中，我们定义了一个接口 Lengthwise，它描述了具有 length 属性的对象。然后，我们使用类型约束 T extends Lengthwise 来指定传入的参数必须符合 Lengthwise 接口。这样，我们可以在函数中使用 arg.length 属性，并确保类型的安全性。

通过使用泛型和类型约束，您可以在TypeScript中编写更灵活和类型安全的代码。泛型允许您以一种通用的方式处理不同类型的数据，从而提高代码的可重用性。在编写TypeScript代码时，考虑使用泛型来增加代码的灵活性和安全性是一个很好的实践。

avatar
文章
阅读
粉丝