TypeScript的类

介绍

类这个概念基本是所有面向对象编程语言都具有一个概念，例如Java、Python等；在JavaScript中ES6 之前是没有类这个概念的，对于熟悉面向对象来程序猿来说有些棘手，因为他们用的都是基于类的继承，对象也是通过类创建出来的。在ES6中添加了类这个概念，虽然只是一个语法糖，但是这就可以让程序员基于类去进行操作了。在TS中也是支持类这个概念的。

定义一个简单的类

在TS中也是使用class关键字来定义一个类，示例代码如下：

class Animal {

  name: string;

  // 构造函数赋值
  constructor(color: string,name:string) {
    this.color = color;
    this.name = name
  }

  getName(){
    console.log('this.name ==>',this.name);
  }

}

let duck = new Animal('小黄鸭')

如果你使用过C#或Java，你会对这种语法非常熟悉。 我们声明一个 Animal类。这个类有3个成员：一个叫做 name的属性，一个构造函数和一个 getName方法。

你会注意到，我们在引用任何一个类成员的时候都用了 this。 它表示我们访问的是类的成员。

最后一行，我们使用 new构造了 duck类的一个实例。 它会调用之前定义的构造函数，创建一个 Animal类型的新对象，并执行构造函数初始化它。

上面的写法还有一种简写形式，如下所示：

class Animal {

  constructor(public color: string, public name:string) {
    this.color = color;
    this.name = name
  }

  public getName(): void{
    console.log('this.name ==>',this.name);
  }

}

// 创建实例
let duck: Animal = new Animal('淡黄色', '小黄鸭')

// 访问duck.name
let duckName: string = duck.name;
console.log('duckName ==>',duckName);

duck.getName()

继承

当多个类存在一些共同的属性和方法，应将这些类的共同属性和方法抽象到公共类中，然后这些类可以通过继承公共类，从而实现引用公共类的属性和方法。

// 定义人类
class Human{
  // 名字
  public name: string;
  // 眼睛
  public eye: string;

  constructor(name: string, eye: string) {
    this.name = name;
    this.eye = eye
  }

  // 定义吃的方法
  public eat(): void{
    console.log(this.name + '会吃饭');
    
  }
}

// 定义会跳舞的人类(子类，派生类)
class DancerHuman extends Human{
  // 扩展自身的属性

  // 舞蹈类型
  public type: string;
  
  // 重新构造器
  constructor(name: string, eye: string,type:string) {
    // 调用Human的构造器方法
    // super()指向Human的constructor方法
    super(name, eye);

    this.type = type;
  }

  // 扩展自身的方法
  public dancer(): void{
    let desc: string = `${this.name}会跳${this.type}`
    console.log('desc ==>',desc);
  }

  // 当父类的方法不能满足子类的需求，可以重写父类的方法
  public eat(): boolean{
    let a: number = 1;
    let b: number = 2;

    return a>b

  }
}

// 定义会游泳的人类
class SwimHuman extends Human{
}

// 创建会跳舞的小红
let xiaohong: DancerHuman = new DancerHuman('小红', '黒色的眼睛','街舞');
console.log('xiaohong ==>', xiaohong);
// xiaohong.eat();
xiaohong.dancer()

let result2: boolean = xiaohong.eat();
console.log(result2);


// 创建会跳舞的小明
let xiaoming: SwimHuman = new SwimHuman('小明', '棕色的眼睛');
console.log('xiaoming ==>', xiaoming);
xiaoming.eat()