在我们写css的时候经常会说到这种样式的继承
因为ts会在我们文件当中检查各种变量名的冲突和重复就导致不能起一致的名字,为了解决这个问题

我们写一个立即执行函数吧所有的代码都放到立即执行函数里,这样就表示,把所有创建在了单独的一个作用域当中,避免名字发生冲突

首先是之前的类:

  1. (function(){
  2. //定义一个表示狗的类
  3. class Dog{
  4. name: String;
  5. age: number;
  6. constructor(name:string,age:number){
  7. this.name = name;
  8. this.age = age;
  9. }
  10. sayHello(){
  11. console.log('汪汪汪');
  12. }
  13. }
  14. const dog = new Dog('旺财',5);
  15. console.log(dog);
  16. dog.sayHello();
  17. })();

我们再来创建的类和对象:

  1. (function(){
  2. class Cat{
  3. name: String;
  4. age: number;
  5. constructor(name:string,age:number){
  6. this.name = name;
  7. this.age = age;
  8. }
  9. sayHello(){
  10. console.log('喵喵喵');
  11. }
  12. }
  13. const cat = new Cat('咪咪',3);
  14. console.log(cat);
  15. cat.sayHello()
  16. })();

我们遇到了:我们定义了俩个类:一个是Dog一个是Cat。唯一不同的sayHello()其他的地方都是一模一样的,但是我们写了俩遍,如果我们想要创建其他的类,也这样太麻烦了。

定义一个Animal的类

  1. (function(){
  2. class Animal{
  3. name: String;
  4. age: number;
  5. constructor(name:string,age:number){
  6. this.name = name;
  7. this.age = age;
  8. }
  9. }
  10. class Dog extends Animal{
  11. }
  12. })();

此时Animal被称为父类,Dog被称为子类
使用继承后,子类会拥有父类的所有的方法和属性

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

**继承**可以做到不修改类的情况下,对这个类进行扩展

如果在子类中添加了和父类相同的方法会覆盖父类的方法。父类的方法还是一样只是改变了子类继承与父类方法的改变。这种子类**覆盖**掉父类的方法的形式,我们称为**方法重写**