在 TypeScript 中，泛型（Generics）是一种强大的特性，它允许我们在编写代码时声明一个通用的类型，以便我们可以在不同的地方使用该类型。
在本文中，我们将深入探讨 TypeScript 中的泛型，包括泛型类，泛型函数以及泛型约束等方面。
泛型类
在 TypeScript 中，我们可以定义一个泛型类，如下所示：
----- --------------- -
------- ----- --- - ---
---------- -- -
---------------------
-
----- -
------ ----------------
-
-在泛型类中，我们使用 <T> 来表示泛型类型。在上面的示例中，我们声明的泛型类名为 GenericClass，并使用 <T> 声明了一个泛型类型参数。在类中，我们可以使用该泛型类型参数来定义成员变量和成员方法。
示例代码：
----- ------- - --- ----------------------- -------------------- -------------------- --------------------------- -- ---
在上面的示例代码中，我们创建了一个 GenericClass 的实例，并将泛型类型参数设为 string。然后我们通过调用 push 方法向实例中添加了两个字符串，最后通过调用 pop 方法取出了最后一个字符串 "bar"。
泛型函数
在 TypeScript 中，我们还可以定义一个泛型函数，如下所示：
-------- ----------------------- --- - - ------ ---- -
在泛型函数中，我们同样使用 <T> 来声明泛型类型参数。在上面的示例中，我们定义了一个泛型函数名为 genericFunction，并为其定义了一个泛型类型参数 T。该函数接收一个参数 arg，类型为 T，并返回一个参数 arg，类型也为 T。
示例代码：
---------------------------------------------- -- ----- ----------------------------------------- -- --
在上面的示例代码中，我们分别调用了 genericFunction 并传入了一个字符串和一个数字。由于我们在调用函数时对泛型类型参数做了具体化的定义，因此在函数作用域内的参数 arg 可以正确地推断出其类型。
泛型约束
在 TypeScript 中，我们可以通过泛型约束来限制泛型类型参数的类型。通常情况下，我们使用泛型约束来确保我们在调用泛型方法或泛型类时，传入的参数具有一些特定的属性或方法。
例如，我们可以创建一个泛型函数，这个函数接收一个有 length 属性的参数，并返回这个参数的长度：
--------- --------- - ------- ------- - -------- ----------- ------- --------------- --- ------ - ------ ----------- -
在上面的示例中，我们使用 extends 关键字来限制泛型类型的类型上界，使其必须继承 HasLength 接口，并具有 length 属性。然后我们定义了一个泛型函数 getLength，并使用 <T extends HasLength> 来限定泛型类型参数的类型。该函数接收一个参数 arg，类型为 T，并返回该参数的 length 属性。
示例代码：
-------------------------------- -- - ------------------------- -- ----- -- - ----------------------- ------- -- ---- -- -- --------------------------- -- ----------------------------
在上面的示例中，我们分别传入了一个字符串、一个数组和一个对象，并调用了 getLength 方法获取这些参数的长度。注意，当我们传入一个不具有 length 属性的参数时，编译器会报错，提示我们该参数的类型不满足 HasLength 接口的要求。
总结
泛型在 TypeScript 中是一种非常有用的特性，它可以让我们编写更加通用、灵活的代码，并使得我们的代码在运行时更加类型安全。在使用泛型时，我们需要注意泛型的定义方式、使用方式以及泛型约束的限制等方面。
通过本文的介绍，我们对 TypeScript 中的泛型有了更深入的了解。我们可以通过定义泛型类、泛型函数以及使用泛型约束等方式，来编写更加灵活、通用的代码。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64a5255b48841e989419bca1