前端Wiki/词条/泛型 Generic

泛型 Generic

定义类型的「参数」：把类型当作变量传递，让函数与类型做到「定义一次、适配多种类型」

泛型的本质是类型层面的参数化。function box(v: T): T 接收什么类型就返回什么类型，调用 box('a') 时 T 被传入 string。它不同于 any：any 是「放弃类型」，泛型是「保留类型且由调用方决定」——类型信息全程跟踪，补全与检查一个不少。

进阶用法：泛型约束（extends）限制 T 必须满足某种结构（如）；默认值；多泛型（Map 的键值）。泛型在 React 函数组件（FC）、工具类型（Partial）中无处不在。

是类型参数，调用时才确定；不同于 any——类型信息全程保留
约束限定类型范围，默认值提供兜底
泛型让「类型」像数据一样被传递与复用，是 TS 的核心表达力

TypeScript

// 基础泛型：传入什么类型，传出什么类型
function box<T>(v: T): T { return v; }
const s = box('hi');     // T = string，s 是 string
const n = box(42);       // T = number

// 泛型约束：T 必须有 length 属性
function len<T extends { length: number }>(x: T): number {
  return x.length;
}
len('abc');              // ✓ 字符串有 length
len([1, 2]);             // ✓ 数组有 length
len(123);                // ✗ number 没有 length

// 泛型接口 + 默认值
type KV<K = string, V = unknown> = { key: K; val: V };
const a: KV = { key: 'k', val: 1 };            // 默认 string/unknown
const b: KV<number, string> = { key: 1, val: 'v' };

⚠ 常见误区

把泛型当 any 用，写却不约束，类型检查形同虚设
函数返回类型标注成具体类型而丢掉了 T，链式调用中断类型推断
约束过严（extends 一个巨大的类型）导致调用方需要大量 as 断言

🔗 相关词条工具类型接口 interface 类型守卫