Typescript中类和类的继承

TS创建类
通过关键字 class 创建类

class Person{
    /*
        直接定义的属性是实例属性,需要通过关键字new来访问
        const per = new Person()
        console.log(per.name)
    */
        name:string = '猴子';
    // 在属性前使用static关键字可以定义类属性,可以直接访问
    //  如 console.log(Person.age)
    static age:number = 18;
    // readonly 表示的属性是只读属性 不可修改  
    readonly color:string = '绿色'

    // 定义方法
    sayHello(){
        console.log('sayhello')
    }
}

const per = new Person()
console.log(per.name)

构造函数

class Dog{
    name:string;
    age:number;
    // constructor 被称为构造函数
    // 构造函数会在对象创建时调用
    constructor(name:string,age:number){
        // 在实例方法中,this表示当前的实例
        // console.log(this)
        //  在方法中通过this来表示当前调用方法的对象
        this.name = name;
        this.age = age
    }
}

const dog = new Dog('小猪',3)
const dog2 = new Dog('小杨',2)

TS中类的继承
在下方代码中,Animal被称为父类,Dog称为子类
使用继承后,我们的子类会拥有父类所有方法和属性()
通过继承我们可以将多个类中的共有的代码写在一个父类
如果子类中添加了和父类相同的方法,子类中的方法会覆盖掉父类的方法!!我们称为方法重新

    class Animal{
        name:string,
        age:number;
        constructor(name:string,age:number){
            this.name = name
            this.age = age
        }
        satHello(){
            console.log('哇哇')
        }
    }
    // 使dog类继承Animal这个类
    class dog extends Animal{
        run(){
            console.log(`${this.name}再叫`)
        }
    }


    const dog = new Dog('小黑',5)
    dog.satHello()
    dog.run()

TS中的Super

  class Animal{
       name:string    
        constructor(name:string ){
            this.name = name    
        }
        sayHello(){
            console.log('哇哇')
        }
  }
  class Dog extends Animal {
      age : number;
      constructor(name:string,age:number){
          // 如果在子类中写了构造函数,在子类的构造函数中必须对父类函数进行调用
          super(name)  // 调用父类的构造函数
          this.age = age
      }
      sayHello(){
          // 在类的方法中,super就表示当前类的父类
          super.satHello()
      }
  }
  const dog = new Dog('旺财')
  dog.sayHello()

抽象类
以abstract 开头的是抽象类
抽象类和其他类区别不大,不能用来创建对象
抽象类就是专门用来被继承的类
抽象类中可以添加抽象方法
当我们不希望这个类被构造 就可以使用abstract


 abstract class Animal{
       name:string    
        constructor(name:string ){
            this.name = name    
        }
        // 定义一个抽象方法
        // 抽象方法使用 abstract 开头 没有方法体
        // 抽象方法只能定义在抽象类中,子类必须对抽象方法进行重写
       abstract sayHello()Lvoid
  }

  class Dog extends Animal{
      sayHello(){
            console.log('汪汪汪')
                }
  }
  const dog = new Dog('旺财')
  dog.sayHello()

你可能感兴趣的:(typescript,前端)