《五》TypeScript 中类的类型

在 TypeScript 中，类的属性必须要明确声明，否则会报错。

class Person {
  // 在 TypeScript 中类的属性必须要明确声明，否则会报错
  // 声明属性的同时可以初始化值；或者也可以直接初始化值，此时会默认进行类型推断
  name: string
  age: number = 18
  height = 1.88

  constructor(name: string, age: number, height: number) {
    this.name = name
    this.age = age
    this.height = height
  }

  eating() {
    console.log(this.name + 'is eating')
  }
}

const p = new Person('Lee', 18, 1.88)
console.log(p.name)

类的成员的修饰符：

在 TypeScript 中，类的属性和方法支持三种修饰符。添加之后，TypeScript 将会检测该成员在哪些地方可见。

1. public：修饰的是在任何地方可见、公有的属性和方法。public 是默认的修饰符。
2. private：修饰的是仅在当前类的内部可见的、私有的属性和方法。
3. protected：修饰的是仅在当前类自身及其子类中可见的、受保护的属性和方法。

class Person {
  private name: string

  constructor(name: string) {
    this.name = name
  }

  eating() {
    console.log(this.name + 'is eating') // 正确。可以访问
  }
}

const p = new Person('Lee')
console.log(p.name) // 报错。不可访问

类的只读属性：

在 TypeScript 中，支持类的只读属性 readonly。添加之后，TypeScript 将会检测该属性只可读、不可写。

class Person {
  readonly name: string

  constructor(name: string) {
    this.name = name
  }
}

const p = new Person('Lee')
console.log(p.name) // 正确。可读
p.name = 'Mary' // 报错。不可写

类的参数属性：

在构造函数的参数前面直接添加修饰符，TypeScript 就可以将其转成一个同名同值的类属性，这些就被称为参数属性。

参数属性可以看作是一种语法糖，相当于做了三件事：

1. 创建一个同名的类属性。
2. 将值赋值给该类属性。
3. 声明类属性，且为其添加上修饰符。

class Person {
  constructor(public name: string) {}
}

// 就相当于：
class Person {
  public name: string

  constructor(name: string) {
    this.name = name
  }
}

抽象类：

TypeScript 中支持抽象类和抽象方法，需要使用 abstract 关键字来声明。

对于如果有共同的父类，但是父类中不需要对某些方法进行具体的实现的时候，就可以将其定义为抽象类。抽象方法必须定义在抽象类中，只有方法名，没有方法体。子类必须实现抽象方法。

抽象类不能被实例化。
抽象类中可以包含抽象方法，也可以包含普通的方法。

//定义一个抽象类和抽象方法
abstract class Shape {
  abstract getShape()
}

// 子类继承抽象类
class React extends Shape{
  constructor(public width: number, public height: number) {
    super()
  }

  // 子类实现抽象方法
  getShape() {
    return this.width * this.height
  }
}

// 子类继承抽象类
class circle extends Shape{
  constructor(public radius: number) {
    super()
  }

  // 子类实现抽象方法
  getShape() {
    return 2 * Math.PI * this.radius
  }
}

// 此处的 Shape，相当于父类的引用指向子类的对象，这就叫做多态
function calcArea(shape: Shape) {
  return shape.getShape()
}
console.log(calcArea(new React(10, 20)))
console.log(calcArea(new circle(10)))