Tyspscript中的class

申明一个类 class

class 类名 {
    // class中主要包含两个部分，属性和方法
    属性
    方法
}

实例属性和类属性

• 实例属性：实例化之后，也就是new之后才能用的属性和方法

• 类属性(静态属性)：class本身自己直接使用的，下面是TS中的属性修饰符

  • static：静态属性，属于类自身不属于实例，只有自身可以访问到
  • readonly：只读属性，只允许读取，不允许修改
  • public：所有属性的默认属性。随意读写
  • private：申明是一个私有属性，不允许在外部访问
  • protected：和private基本一样，也是不允许在外部访问，但是允许在子 类中访问

• demo

  class Person {
      // 定义实例属性
      name:string = '景天';
      // 在属性前使用static关键字可以定义类属性
      static age:number = 18;
      
      // 定义实例方法
      sayHello() {
          console.log('Hello')
      }
      
      // 定义类方法
      static sayHi() {
          console.log('Hi')
      }
  }
  
  // 实例属性和方法的使用
  class p = new Person()
  console.log(p.name)
  p.sayHello()
  
  // 类属性和方法的使用
  console.log(Person.age)
  Person.sayHi()

class中的构造函数(constructor)

• 常规写法

  class Person {
      name: string
      age: number
      
      // constructor 被称为构造函数
      // 构造函数会在实例对象创建的时候调用
      constructor(name:string,age:number) {
          // 在实例方法中，this就是表示当前的实例
          // 在构造函数中，当前对象就是当前新建的那个对象
          // 可以通过this向新建的对象中添加属性
          this.name = name
          this.age = age
      }
      
      sayHi() {
          // 在实例方法中，可以通过this来表示当前调用方法的对象
          console.log(this)
          console.log(`你好，我是${this.name}`)
      }
  }
  
  class p = new Person('景天'，18)
  console.log(p.name,p.age)

• 简写方式

  class Person {
      // 可以把属性的定义写到构造函数的参数中去，所示一种语法糖的写法
      constructor(public name:string, public age:number) {
      }
      
      sayHi() {
          console.log(`你好，我是${this.name}`)
      }
  }
  
  class p = new Person('景天'，18)
  console.log(p.name,p.age)

class中的继承

• 使用继承后，子类将会拥有父类所有的方法和属性。
• 如果子类中和父类中有相同的属性和方法，子类中会覆盖父类的方法。
• 使用：子类 extends 父类

• demo

  // 创建一个父类
  class Animal {
      name: string
      
      constructor(name:string) {
          this.name = name
      }
      
      sayHi() {
          console.log('动物们说Hi')
      }
  }
  
  // 狗这个子类继承父类
  class Dog extends Animal {
      age: number
      
      constructor(name:string,age:number) {
          // 如果在子类中写了构造函数，在子类的构造函数中必须要调用下父类的构造函数
          // super就是代表父类中的构造函数
          super(name);
          this.age = age
      }
  
      // 添加一个自己的方法
      run() {
          console.log('我在跑呢')
      }
  }
  
  // 猫这个子类继承父类
  class Cat extends Animal {
      // 子类中也有sayHi方法，会覆盖父类中的方法，使用自己的方法
      sayHi() {
          console.log('喵喵喵喵')
      }
  }
  
  let dog = new Dog('哮天犬',1000)
  dog.sayHi()
  dog.run()
  let cat = new Cat('九命猫妖')
  cat.sayHi()

抽象类和抽象方法

• 抽象类：用abstract开头，这代表是一个抽象类，抽象类和其他类的区别不大，只是不能用来创建对象。
• 抽象方法：同样abstract开头，抽象方法只能定义在抽象类中，并且子类中必须对抽象方法进行重写。

• demo

  // 创建一个父类
  /* 
      我们之前创建的父类，除了可以被继承，自己也可以实例化，但是有时候我们就想申明一个父类，不允许实例化。
      那么可以用abstract开头，这代表是一个抽象类，抽象类和其他类的区别不大，只是不能用来创建对象。
      可以说抽象类就是用来创建父类给子类继承的。
      抽象类中可以添加抽象方法。
  */
  abstract class Animal {
      name: string
      
      constructor(name:string) {
          this.name = name
      }
      
      // 定义一个抽象方法，同样abstract开头，没有方法体。
      // 抽象方法只能定义在抽象类中，并且子类中必须对抽象方法进行重写。
      // void：空值
      abstract sayHi():void
  }
  
  class Dog extends Animal {
      sayHi() {
          console.log("汪汪汪")
      }
  }
  
  let a = new Animal() // 这样就会报错，因为不允许实例化

接口

• 和抽象类相比

  • 抽象类的属性值可以是有值得也可以是没值，接口的属性值都是没值的，只定义结构，不考虑实际值
  • 接口中所有的方法都是抽象方法。
  • 使用抽象类，是用extends继承，可以继承父类的方法，也可以重写。接口是使用implements，而且必须满足接口中所有要求

• demo

  // 定义一个接口
  interface myInter {
      name: string
      
      sayHello():void
  }
  
  // 定义一个类去实现上面的接口，必须满足接口的所有要求
  class Myclass implements myInter {
      name：string
      
      constructor(name:string) {
          this,name = name
      }
      
      sayHello() {
          console.log('Hello')
      }
  }
  
  // 接口如何扩展呢？可以使用extends扩展，但是原来的不会改变
  interface myInter2 extends myInter {
      age: number
  }
  
  // 需要注意的一点是，接口是允许重复的，并不会覆盖，而是会合并
  // 下面这样的，obj就会有两个属性name和age
  interface obj {
      name: string
  }
  interface obj {
      age: number
  }

属性的封装

• 应用场景：有时候我们不想属性简单的暴露出去，也不想被随意更改

• 简单的封装

  class Person {
      /* 
          TS可以在属性前面添加修饰符
              - static：静态属性，属于类自身不属于实例，只有自身可以访问到
              - readonly：只读属性，只允许读取，不允许修改
              - public：所有属性的默认属性。随意读写
              - private：申明是一个私有属性，不允许在外部访问
              - protected：和private基本一样，也是不允许在外部访问，但是允许在子类中访问
      */
      
      // 私有化两个属性
      private _name：string
      private _age: number
      
      constructor(name:string,age:number) {
          this._name = name;
          this._age = age;
      }
      
      // 提供给外界访问和修改私有属性的方法
      getName() {
          return this._name
      }
      setName(value:string) {
          this._name = value
      }
      getAge() {
          return this._name
      }
      setAge(value:number) {
          if(value > 0) {
              this._age = value
          }
      }
  }
  
  let p = new Person('景天'，18)
  
  console.log(p.getName());
  p.setName('雪见')
  console.log(p.getAge());
  p.setAge(17)

• 存取器，比上面简单的封装好的多，这才是常用的方式

  // 使用属性存取器
  class Person {
      // 私有化两个属性
      private _name：string
      paivate _age: number
      
      constructor(name:string,age:number) {
          this._name = name;
          this._age = age;
      }
      
      // 提供给外界访问和修改私有属性的方法
      get name() {
          return this._name
      }
      set name(value:string) {
          this._name = value
      }
      get age() {
          return this._name
      }
      set age(value:number) {
          if(value > 0) {
              this._age = value
          }
      }
  }
  
  let p = new Person('景天'，18)
  
  console.log(p.name);
  p.name = '雪见'
  console.log(p.age);
  p.age = 17