TypeScript 泛型的深入解析与基本使用

﹏ヽ暗。殇╰゛Y 2023-10-14 19:18 64阅读 0赞

## 系列文章目录 ##

--------------------

#### 文章目录 ####

*  系列文章目录
 *  前言
 *  一、泛型的概念
 *  二、泛型函数
 *  三、泛型类
 *  四、泛型接口
 *  五、泛型约束
 *  总结

--------------------

## 前言 ##

泛型是TypeScript中的一个重要概念，它允许我们在定义函数、类或接口时使用参数化类型，增强了代码的灵活性和重用性。本文将深入探讨泛型的概念，以及如何在TypeScript中进行基本的泛型使用。

--------------------

## 一、泛型的概念 ##

泛型（Generics）是指在定义函数、类或接口时，不预先指定具体的数据类型，而是在使用时才指定数据类型。这种灵活的参数化类型能够增强代码的通用性和复用性，使代码更具弹性。

## 二、泛型函数 ##

在函数中使用泛型，可以实现在多种数据类型上执行相同的操作。例如，下面是一个简单的泛型函数，用于交换两个变量的值：

function swap<T>(a: T, b: T): void {
        
        let temp: T = a;
        a = b;
        b = temp;
    }
    
    let x = 5, y = 10;
    swap(x, y);
    console.log(x, y); // 输出 10 5

## 三、泛型类 ##

与函数一样，类也可以使用泛型。例如，我们可以创建一个泛型的Pair类，用于存储一对值：

class Pair<T, U> {
        
        constructor(public first: T, public second: U) {
        }
    }
    
    let pair = new Pair<number, string>(1, 'hello');
    console.log(pair.first, pair.second); // 输出 1 hello

## 四、泛型接口 ##

泛型也可以用于接口的定义。例如，下面是一个泛型接口，用于定义一个通用的栈数据结构：

interface Stack<T> {
        
        push(item: T): void;
        pop(): T;
    }
    
    class NumberStack implements Stack<number> {
        
        private items: number[] = [];
        
        push(item: number): void {
        
            this.items.push(item);
        }
        
        pop(): number {
        
            return this.items.pop();
        }
    }

## 五、泛型约束 ##

有时候，我们希望对泛型进行一定的约束，以确保其满足特定条件。例如，我们可以为泛型函数添加一个约束，使其仅接受包含length属性的参数：

function printLength<T extends {
           length: number }>(item: T): void {
        
        console.log(item.length);
    }
    
    printLength('hello'); // 输出 5
    printLength([1, 2, 3]); // 输出 3

## 总结 ##

通过本文，你已经了解了TypeScript中泛型的概念以及基本使用方法。泛型能够让你的代码更加灵活，使其可以适应不同类型的数据。

希望本文对你在学习和使用TypeScript泛型时有所帮助。如果你有任何问题或疑问，欢迎留言讨论。感谢阅读！