TS中Class类的继承

我们有下面一个代码,其中创建了一个Dog类和Cat类,这两个类中都有姓名和年龄属性和bark方法

TypeScript 复制代码
class Dog {
  name: string;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
  bark() {
    console.log(this.name + "汪汪汪");
  }
}

class Cat{
  name: string;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
  bark() {
    console.log(this.name + "喵喵喵");
  }
}

let dog = new Dog("旺财", 5);
let cat = new Cat("咪咪", 3);
dog.bark();  // 打印:旺财汪汪汪
cat.bark();  // 打印:咪咪喵喵喵

但是我们把一个代码写了两次,冗余度增加。

一、使用extends关键字继承父类

我们可以将上面两个类的公共特征提取出来组成一个新的Animal类。

然后在创建Dog类和Cat类的时候继承Animal类即可。

子类继承父类的语法格式如下:

class 子类 extends 父类 { }

TypeScript 复制代码
class Animal {
  name: string;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
  bark() {
    console.log(this.name + "在叫");
  }
}

class Dog extends Animal {}

class Cat extends Animal {}

let dog = new Dog("旺财", 5);
let cat = new Cat("咪咪", 3);
dog.bark(); // 打印:旺财在叫
cat.bark(); // 打印:咪咪在叫

通过继承类可以将多个类中共有的代码写在一个父类中,这样只需要写一次即可让所有的子类拥有父类的属性和方法。

二、子类中属性和方法的添加

如果希望在子类中添加一些父类没有的属性和方法,直接在子类中添加即可。

三、子类中方法的重写

如果子类中添加了和父类相同的方法,子类的方法会覆盖掉父类的方法。

这种子类覆盖掉父类的方法的形式,我们称之为重写。

相关推荐
猫3284 分钟前
echarts 日常问题解决
前端·javascript·echarts
新中地GIS开发老师7 分钟前
地信职业百科④:GIS开发工程师
前端·数据库·gis·webgis·三维gis开发
我是大卫16 分钟前
【图】React源码解析-从数据结构、调度器、源码设计模式到状态计算引擎,深挖useReducer原理
前端·react.js·源码
willes23 分钟前
列表中的倒计时组件
前端
LVZ25 分钟前
用了半年 AI 写代码,最烦的不是代码,是环境
前端·后端·开源
polaris_tl25 分钟前
一行 `compress: false`,为什么让 SSE 首包恢复实时返回
前端
海边的云27 分钟前
别再让 AI 瞎改代码:一套让大模型「收敛」的前端专家 Skill》
前端
kisshyshy27 分钟前
给端侧大模型装上“发动机”:React 合成事件 + 进度条组件全解
前端·react.js·node.js
格林威29 分钟前
工业相机Chunk功能全解析:图像嵌入时间戳、编码器元数据(附堡盟C#代码)
开发语言·人工智能·数码相机·计算机视觉·c#·视觉检测·工业相机
hunterandroid39 分钟前
DataStore 工程化实践:迁移、并发更新与异常恢复
android·前端