在 TypeScript 中，泛型是非常常见的一种类型约束方法。泛型可以增加代码的可复用性和稳定性。然而，如何正确使用泛型并合理的进行类型约束是一门需要深入学习的技艺。本文将会详细讲解 TypeScript 中的泛型类型约束方法，并通过示例代码进行指导。
1. 泛型基础概念
在 TypeScript 中，泛型指的是变量在使用时才确定其类型，可以在函数定义、接口、类等语法中使用。举个例子，我们可以定义一个泛型函数：
function identity<T>(arg: T): T {
return arg;
}这个函数 identity 接收任意类型的参数，并返回该参数本身。我们可以调用这个函数，并通过传入不同的参数，得到不同的返回值：
let output1 = identity<string>('hello');
console.log(output1); // 输出：hello
let output2 = identity<number>(123);
console.log(output2); // 输出：123但这样的语法是没有实际效果的。因为在使用泛型时，我们往往需要对泛型进行类型约束，以达到增强代码可读性、减少类型错误的效果。
2. 泛型类型的约束方法
2.1. 约束泛型类型的值类型
我们可以通过 extends 关键字约束泛型类型具备某个类型的属性或方法。下面的示例代码，展示了如何约束泛型类型必须具备 length 属性：
-- -------------------- ---- ------- --------- --------- - ------- ------- - -------- ---------- ------- --------------- --- - - ------------------------ ------ ---- - --- ------- - -------------------------- --------------------- -- -------- --- ------- - ---------------------- -- -------------- --------- --
上面代码中，使用了 extends 关键字对 T 进行了约束，使得 T 必须满足 HasLength 接口的约束条件。而在返回 arg 值时，T 依旧保持其类型特征。
2.2. 约束多个泛型类型
在 TypeScript 中，一个函数可以接收多个泛型参数，而这些泛型参数可以相互影响。下面的示例代码，展示了如何约束两个泛型参数同时具备某些属性：
-- -------------------- ---- ------- --------- --------------- - ------ ------- ------- ------- - -------- --------------- ------- ---------- - ------- ----------------------- -- ------ --- ------ - ------ ------------ - ----------- - ------------- - ----- ------ - --------------------- ------------------------- - ------ -- ------- - --- -------------------- -- -----
在使用泛型进行类型约束时，我们同样可以使用 extends 关键字进行约束。
2.3. 约束泛型类型的数据类型
有时候，我们需要定义一个函数，要求其返回类型与传入参数的类型一致。下面的示例代码，展示了如何约束泛型只接收 string 类型的参数：
function identity<T extends string>(arg: T): T {
return arg;
}
let output1 = identity<string>('hello');
console.log(output1); // 输出：hello
let output2 = identity<number>(123); // 编译时错误：该参数类型不满足 string 约束2.4. 结合 keyof 定义泛型类型
在 TypeScript 中，我们还可以通过 keyof 关键字获取某个对象类型的所有键名，并把它作为参数的类型。下面的示例代码，展示了如何结合 keyof 关键字定义泛型类型：
-- -------------------- ---- ------- --------- ------ - ----- ------- ---- ------- - -------- -------------- - ------- ----- ------- -- ---- -- - ------ --------- - ----- ------- ------ - - ----- ------ ---- --- - ------------------------------- --------- -- ------ ------------------------------- -------- -- -----
在上面的代码中，我们定义了 getProperty 函数，该函数接收两个参数：一个泛型对象 obj 和一个 obj 的键名 key。使用 keyof 对泛型类型进行约束，使得 key 的值只能为 obj 的所有键名中的一个。
总结
在 TypeScript 中，泛型类型约束是提高代码可读性、减少类型错误的一种方法。本文通过讲解实战代码中的各种使用方法和约束方式，希望对大家理解和掌握 TypeScript 泛型类型约束有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651a1cf295b1f8cacd223254