extends 和 implements

一句话核心在 TS 中implements就是强制一个「类class」必须严格实现某个「接口interface」里规定的所有属性和方法。少一个、写错类型、写错名字 →直接报错作用约束类的结构保证代码规范、不写错超简单示例一看就懂1. 先定义接口定规矩接口只规定这个类必须有什么不写具体实现。// 定规矩一个“人”必须有名字 会说话 interface Person { name: string; sayHi(): void; }2. 用implements遵守规矩类想要符合这个结构就必须implements 接口名并且把所有属性、方法补齐// Student 类 实现 Person 接口 class Student implements Person { // 必须有 name类型必须是 string name: string; constructor(name: string) { this.name name; } // 必须有 sayHi 方法格式必须匹配 sayHi() { console.log(你好我是 ${this.name}); } }3. 不遵守直接报错如果你漏写、写错类型TS 立刻红波浪线提醒你// ❌ 报错缺少 name 属性 缺少 sayHi 方法 class Student implements Person {}implements在 TS 里的 3 个关键作用1. 强制类的结构规范防止你手滑写错属性名、方法名、类型从根源减少 bug。2. 一个类可以implements多个接口这是 TS 非常实用的功能一个类遵守多套规矩interface Animal { run(): void; } interface Eater { eat(): void; } // 同时遵守两套规矩 class Dog implements Animal, Eater { run() {} eat() {} }3. 和extends完全不一样必区分extends继承 →拿别人现成的代码用父子关系implements实现 →只遵守结构不拿代码合同关系// 可以同时 继承 实现 class Animal { legs 4; } class Cat extends Animal implements Person { name 小猫; sayHi() {} }最简单总结interface 给类定结构规矩implements 类承诺我严格按这个规矩写好处代码更规范、不容易写错、IDE 自动提示更精准你平时写 TS 类只要想固定这个类必须有哪些属性 / 方法就用interface implements。在 TypeScriptTS中extends主要用于泛型约束和接口 / 类的继承以下是具体用法解析1. 泛型约束Generic Constraints通过extends限制泛型类型必须满足的条件确保类型安全。基础用法function loggingIdentityT extends string(arg: T): T { console.log(arg.length); // 因T被约束为string可访问length属性 return arg; }约束为接口 / 类型interface HasLength { length: number; } function loggingIdentityT extends HasLength(arg: T): T { console.log(arg.length); // 任何满足HasLength接口的类型都可使用 return arg; }多重约束用连接function getPropsT extends { a: number } { b: string }(obj: T) { return obj.a obj.b.length; }2. 接口继承Interface Inheritance接口可通过extends继承多个接口合并其成员。interface Shape { color: string; } interface PenStroke { penWidth: number; } // 继承多个接口合并color和penWidth interface Square extends Shape, PenStroke { sideLength: number; } 注意写法 下面这种 interface A extends B, V, F 或者是 interface Square extends Shape, PenStroke { sideLength: number; }3. 类继承Class Inheritance与 Java 等语言类似子类用extends继承父类的属性和方法。class Animal { move(distance: number 0) { console.log(Animal moved ${distance}m); } } class Dog extends Animal { bark() { console.log(Woof!); } } const dog new Dog(); dog.move(10); // 继承自Animal的方法 dog.bark(); // 子类特有方法4. 泛型中的条件类型Conditional Types结合extends实现类型判断语法为T extends U ? X : Y。示例获取数组元素类型type ElementTypeT T extends Arrayinfer U ? U : T; // 若T是数组返回元素类型U否则返回T本身 type Str ElementTypestring[]; // string type Num ElementTypenumber; // number核心区别与注意点泛型约束限制泛型必须符合某种类型或接口确保操作合法性。接口 / 类继承复用已有类型的成员减少代码重复。条件类型基于extends的类型逻辑判断常用于工具类型如Pick、Exclude以下是extends和implements在ts中的区别和示例示例1使用extends实现类继承class Animal { move() { console.log(Moving); } } class Dog extends Animal { bark() { console.log(Barking); } } const dog new Dog(); dog.move(); // 继承自父类 Animal 的方法 dog.bark();使用extends实现接口的扩展interface BaseInterface { name: string; } interface ExtendedInterface extends BaseInterface { age: number; } const obj: ExtendedInterface { name: John, age: 30 };使用extends实现继承和重写方法class Parent { showMessage() { console.log(Parent message); } } class Child extends Parent { showMessage() { console.log(Child message); } } const child new Child(); child.showMessage(); // 输出 Child message使用extends实现继承构造函数和属性class Parent { constructor(public name: string) {} } class Child extends Parent { constructor(name: string, public age: number) { super(name); } } const child new Child(Alice, 10); console.log(child.name); // Alice console.log(child.age); // 10示例2使用implements实现接口class classA implements interfaceA在 TypeScript 中implements关键字用于类实现接口。接口定义了一组方法和属性的签名而使用implements关键字的类必须提供与接口定义相匹配的实现。以下是一些常见的使用场景1.定义公共契约当多个类需要遵循相同的一组规则或行为时可以创建一个接口来定义这些规则。然后让相关的类使用implements来实现这个接口确保它们具有一致的公共方法和属性。interface IPrintable { print(): void; } class Document implements IPrintable { print(): void { console.log(Printing document); } } class Image implements IPrintable { print(): void { console.log(Printing image); } }2.模拟多重继承在 TypeScript 中不支持类的多重继承但可以通过接口和implements来实现类似的效果。interface IReadable { read(): void; } interface IWriteable { write(): void; } class File implements IReadable, IWriteable { read(): void { console.log(Reading file); } write(): void { console.log(Writing to file); } }interface ComparerT { compare(a: T, b: T): number; } class StringComparer implements Comparerstring { compare(a: string, b: string) { // 比较字符串的逻辑 return a.localeCompare(b); } }