上一篇
5.0 TypeScript 类的构造函数_十一月丶萧邦的博客-CSDN博客
首先,我们先来看看为什么需要继承?首先来看一段代码
// Dog类
class Dog {
name: string;
age: number;
constructor(name: string, age: number) {
this.name = name
this.age = age
}
say(): void {
console.log('旺旺旺')
}
}
// Cat类
class Cat {
name: string;
age: number;
constructor(name: string, age: number) {
this.name = name
this.age = age
}
say(): void {
console.log('喵喵喵')
}
}
const dog = new Dog('陈贝拉', 8)
console.log(dog)
dog.say()
const cat = new Cat('陈多拉', 1)
console.log(cat)
cat.say()
代码输出:
看起来,一切都是那么的风平浪静,没有什么问题,但是我们会看到,Dog类和Cat类中都包含name,age属性,say方法,两个类,这么点属性还好,如果再让写很多很多类,类中都包含着这些个属性方法,那我们岂不是要进行CV大法了。。。代码看起来也费劲,所以继承就出现了!
要理解继承的概念啊,我先来引入一张百度找到的图!从站在生物学的角度来看,恐龙的进化图!
咱们可以把每个恐龙都当成是一个类,从图上来看,所有的类都是源自于始盗龙类,最后剑龙类里面一定包含着最开始的始盗龙的一些基因数据,这就是继承啦!上方的代码缺的是什么?缺的不就是最开始的那个始盗龙的类吗?于是乎代码改写:创建一个Animal类
class Animal {
name: string
age: number
constructor(name: string, age: number) {
this.name = name
this.age = age
}
say(): void {
console.log('小动物在嗷呜')
}
}
// extends:英文代表扩展的意思,在这里就作为继承的关键字了
// Dog类继承了Animal类
class Dog extends Animal {
}
// Cat类继承了Animal类
class Cat extends Animal {
}
const dog = new Dog('陈贝拉', 8)
console.log(dog)
dog.say()
const cat = new Cat('陈多拉', 1)
console.log(cat)
cat.say()
代码输出
这样写出来的代码是不是看着简化了很多,但是问题又来了,我们想要的是狗子 是旺旺旺,小猫是喵喵喵,现在都成小动物在嗷呜了。。。继续改吧,
通过对say方法进行传值,我们得到了我们想要的
say(str: string): void {
console.log(str)
}
dog.say('旺旺旺')
cat.say('喵喵喵')
问题又来了,狗子不但会旺旺旺,还会看家护院,我需要赋予Dog这个类看家护院的方法,至于猫呢,我想让它say的时候,说:喵喵喵喵喵喵喵喵,
class Dog extends Animal {
// 添加新的方法
lookHouse(): void {
console.log(`${this.name}可以看家护院!`)
}
}
class Cat extends Animal {
// 当子类的方法与父类的方法一致时,子类的方法会覆盖掉父类的方法,以子类的方法为准
say(): void {
console.log('喵喵喵喵喵喵喵喵')
}
}
dog.say('旺旺旺')
dog.lookHouse()
console.log(cat)
cat.say()
那么我们就可以总结一些结论:
通过继承可以将多个类中共有的代码写在一个父类之中;
在使用继承后,子类将会拥有父类所有的方法属性;
如果我们希望在子类中增加单独的属性方法,那么直接添加即可;
如果在子类中添加了和父类相同的方法,则子类的方法会覆盖掉父类的方法,这种做法我们称之为方法重写
完整代码:
class Animal {
name: string
age: number
constructor(name: string, age: number) {
this.name = name
this.age = age
}
say(str: string): void {
console.log(str)
}
}
// Dog类继承了Animal类
class Dog extends Animal {
lookHouse(): void {
console.log(`${this.name}可以看家护院!`)
}
}
// Cat类继承了Animal类
class Cat extends Animal {
say(): void {
console.log('喵喵喵喵喵喵喵喵')
}
}
const dog = new Dog('陈贝拉', 8)
console.log(dog)
dog.say('旺旺旺')
dog.lookHouse()
const cat = new Cat('陈多拉', 1)
console.log(cat)
cat.say()