TypeScript Academy · 课时

使用 extends 约束泛型

Q: 「使用 extends 约束泛型」这节课中我会学到什么？

将类型参数限制为特定结构 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

将类型参数限制为特定结构

使用 extends 约束泛型 是 CoddyKit 上的免费 TypeScript Academy 课时。这是第 3 节课，共 4 节。你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。这是 TypeScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。

欢迎

泛型约束会限制可作为类型实参传入的类型。使用 `extends` 要求 T 具有某些属性，或符合某种形状。

没有约束时的问题

没有约束时，TypeScript 不知道对 T 执行哪些操作是有效的，因此只允许执行所有类型共有的操作。

function getLength<T>(val: T): number {
  // return val.length; // Error — T might not have .length
}

添加约束

使用 `T extends Shape`，要求 T 至少具有 Shape 的所有属性。

function getLength<T extends { length: number }>(val: T): number {
  return val.length;
}
getLength('hello');  // OK — string has .length
getLength([1, 2]);   // OK — array has .length
// getLength(42);   // Error — number has no .length

约束为接口

将 T 约束为实现某个特定接口的类型。

interface Named { name: string; }
function greet<T extends Named>(person: T): string {
  return 'Hello, ' + person.name;
}

keyof 约束

使用 `K extends keyof T`，将 K 约束为 T 的键。这样可以安全地访问属性。

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}
const age = getProperty({ name: 'Alice', age: 30 }, 'age'); // number

扩展联合类型

可以将 T 约束为联合类型，把类型实参限制为特定值。

type Status = 'active' | 'inactive' | 'banned';
function setStatus<T extends Status>(status: T): void {
  console.log('Setting status:', status);
}

约束为构造函数

将 T 约束为类（具有构造函数），这样您就可以在函数内部创建实例。

function create<T>(ctor: new () => T): T {
  return new ctor();
}

使用交集的多个约束

使用交集将 T 约束为满足多个接口。

interface Serializable { serialize(): string; }
interface Loggable { log(): void; }
function process<T extends Serializable & Loggable>(item: T): void {
  item.log();
  console.log(item.serialize());
}

约束继承

约束支持继承。如果 T extends 基类，您就可以调用基类的所有方法。

class Animal { breathe() { return 'breathing'; } }
function care<T extends Animal>(a: T): string { return a.breathe(); }

T 扩展自身（递归）

约束可以自引用，用于表示递归数据结构。

interface Comparable<T> { compareTo(other: T): number; }
function max<T extends Comparable<T>>(a: T, b: T): T {
  return a.compareTo(b) >= 0 ? a : b;
}

约束错误消息

当类型实参不满足约束时，TypeScript 会报告清晰的错误，同时指出该实参和约束。

快速检查

`K extends keyof T` 将 K 约束为什么？

回顾

使用 `T extends SomeType` 约束泛型类型参数。这样可以调用 T 上的特定方法，使用 keyof 安全地访问属性，并构建类型安全的工具函数。

常见问题解答

「使用 extends 约束泛型」课时是免费的吗？

是的 — 「使用 extends 约束泛型」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 TypeScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。

「使用 extends 约束泛型」这节课中我会学到什么？

将类型参数限制为特定结构你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗？

无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。这是第 3 节课，共 4 节。

「使用 extends 约束泛型」课时需要多长时间？

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。

我能在这节 TypeScript Academy 课中编写并运行代码吗？

能。每节 TypeScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

← 返回 TypeScript Academy