7.0 站在生物学的角度看TypeScript类的继承

上一篇

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()