TS 中类型的继承

在 TypeScript(TS)中,类型的继承通常通过接口(Interfaces)和类(Classes)来实现。接口提供了一种定义对象形状的方式,而类则提供了一种创建对象实例的方式。以下是如何在 TypeScript 中实现类型继承的详细说明。

1. 使用接口继承接口

接口可以继承其他接口,从而组合和扩展多个接口的功能。

typescript 复制代码
interface Animal {
    name: string;
    eat(): void;
}

interface Dog extends Animal {
    breed: string;
    bark(): void;
}

const myDog: Dog = {
    name: "Buddy",
    breed: "Golden Retriever",
    eat() {
        console.log(`${this.name} is eating.`);
    },
    bark() {
        console.log(`${this.name} is barking.`);
    }
};

在这个例子中,Dog 接口继承了 Animal 接口,因此 Dog 必须实现 Animal 接口中的所有属性和方法,同时还可以添加新的属性和方法。

2. 使用类实现接口

类可以实现一个或多个接口,确保类包含接口中定义的属性和方法。

typescript 复制代码
interface Animal {
    name: string;
    eat(): void;
}

class Dog implements Animal {
    name: string;

    constructor(name: string) {
        this.name = name;
    }

    eat() {
        console.log(`${this.name} is eating.`);
    }

    bark() {
        console.log(`${this.name} is barking.`);
    }
}

const myDog = new Dog("Buddy");
myDog.eat();
myDog.bark();

在这个例子中,Dog 类实现了 Animal 接口,因此它必须包含 name 属性和 eat 方法。Dog 类还可以添加额外的属性和方法,如 bark。

3. 类继承类

类可以继承其他类,从而复用和扩展父类的属性和方法。

typescript 复制代码
class Animal {
    name: string;

    constructor(name: string) {
        this.name = name;
    }

    eat() {
        console.log(`${this.name} is eating.`);
    }
}

class Dog extends Animal {
    breed: string;

    constructor(name: string, breed: string) {
        super(name); // 调用父类的构造函数
        this.breed = breed;
    }

    bark() {
        console.log(`${this.name} is barking.`);
    }
}

const myDog = new Dog("Buddy", "Golden Retriever");
myDog.eat();
myDog.bark();

在这个例子中,Dog 类继承了 Animal 类,因此它可以使用父类 Animal 的 name 属性和 eat 方法。Dog 类还可以添加新的属性和方法,如 breed 和 bark。

4. 混合使用接口和类

在实际开发中,你可能会混合使用接口和类来实现复杂的类型继承关系。

typescript 复制代码
interface Animal {
    name: string;
    eat(): void;
}

interface DogInterface extends Animal {
    breed: string;
    bark(): void;
}

class AnimalBase implements Animal {
    name: string;

    constructor(name: string) {
        this.name = name;
    }

    eat() {
        console.log(`${this.name} is eating.`);
    }
}

class Dog extends AnimalBase implements DogInterface {
    breed: string;

    constructor(name: string, breed: string) {
        super(name);
        this.breed = breed;
    }

    bark() {
        console.log(`${this.name} is barking.`);
    }
}

const myDog = new Dog("Buddy", "Golden Retriever");
myDog.eat();
myDog.bark();

在这个例子中,DogInterface 接口扩展了 Animal 接口,AnimalBase 类实现了 Animal 接口,而 Dog 类则继承了 AnimalBase 类并实现了 DogInterface 接口。这种混合使用接口和类的方式可以提供更高的灵活性和可维护性。

通过这些示例,你可以看到 TypeScript 提供了多种方式来实现类型的继承,以满足不同的开发需求。

相关推荐
mbshqqb15 小时前
TypeScript基础教程之同步生成器
前端·javascript·typescript
濮水大叔1 天前
Cabloy 双引擎架构详解:Vona 与 Zova 是如何协作的
typescript·node.js·全栈
前端大斗师1 天前
「大于 1000」把 1000 元那单也算进去了:我在 Vue3 订单页对了 10 句话
前端·人工智能·typescript·大模型·原力计划
GlobalAIagent2 天前
外贸站上线前的技术自查清单:漏一项询盘可能消失
google·typescript·ar·go语言·seo
半糖程序员2 天前
从零构建 Agent(11):压缩过长的上下文
typescript·agent
whi2 天前
一个小工具,解决了一个困扰 Vue 开发者多年的类型检查难题
vue.js·typescript
shmily麻瓜小菜鸡2 天前
Axios 中 params 与 data 的区别与原理
javascript·typescript
nyaomaru3 天前
将一个真实的 TypeScript OSS 库从 tsup 迁移到 tsdown
前端·typescript
wflynn4 天前
GitHub 今日推荐|ts-rust:把微软 TypeScript-Go 编译器逐行移植成 Rust 实现
rust·typescript·开源·github·compiler·tsc
Duang007_4 天前
生产可观测性:从“系统慢“到“根因“的完整链路(Go / TypeScript)
后端·python·golang·typescript·prometheus