class(类)

面向对象实践 OOP 编程思想,在实际工作中,都是极其有用的抽象、封装利器。

1class Person {
2  name: string;
3  say(this: Person, song: string): Person {
4      console.log(song);
5      return this;
6  }
7  constructor(name: string) {
8    this.name = name;
9  }
10}
11
12let p1 = new Person('张三');
13p1.say('Song').name;

继承

使用extends关键字实现继承

1class Male extends Person {
2    age: number;
3    constructor(name: string, age: number) {
4        super(name);
5        this.age = age;
6    }
7}

修饰符

在 TypeScript 中就支持 3 种访问修饰符,分别是 public、private、protected。通过这三个修饰符做到控制属性和方法的访问。

  • public:基类、子类、类外部都可以访问;
  • protected:基类、子类可以访问,类外部不可以访问;
  • private:基类可以访问,子类、类外部不可以访问;
  • readonly:只读修饰符
1class Person {
2    public readonly name: string = '张三';
3    protected age: number = 20;
4    private height: string = '180';
5    protected getPersonInfo():void {
6        console.log(this.name, this.age, this.height); // 基类里面三个修饰符都可以访问
7    }
8}
9
10class Male extends Person {
11    public getInfo():void {
12        console.log(this.name, this.age); // 子类只能访问public、protected修饰符的
13    }
14}
15
16let m = new Male();
17console.log(m.name); // 类外部只能访问public修饰的
18m.name = '李四'; // name属性使用只读修饰符,所以不能对name进行赋值修改操作

静态属性

基于静态属性的特性,往往会把与类相关的常量、不依赖实例 this 上下文的属性和方法定义为静态属性,从而避免数据冗余,进而提升运行性能。

1class Person {
2  static title: string = "个人信息";
3}
4
5Person.title;

抽象类和接口

抽象类,它是一种不能被实例化仅能被子类继承的特殊类。

1abstract class Person {
2  abstract name: string;
3  abstract getName(): void;
4  extendsFn():void {
5    console.log('扩展方法');
6  }
7}
8
9class Male extends Person {
10  constructor(name: string) {
11    super();
12    this.name = name;
13  }
14  name: string;
15  getName(): void {
16    console.log(this.name);
17  }
18}

接口interface也可以约束类的实现,使用接口与使用抽象类相比,区别在于接口只能定义类成员的类型

1interface Person {
2  name: string;
3  age: number;
4  getName: () => void;
5}
6
7class Male implements Person {
8  constructor(name: string, age: number) {
9    this.name = name;
10    this.age = age;
11  }
12  name: string;
13  age: number;
14  getName(): void {
15    console.log(this.name);
16  }
17}

类的类型

在声明类的时候,其实也同时声明了一个特殊的类型(确切地讲是一个接口类型),这个类型的名字就是类名,表示类实例的类型。

1class Male {
2  constructor(name: string, age: number) {
3    this.name = name;
4    this.age = age;
5  }
6  name: string;
7  age: number;
8  getName(this: Male): void {
9    console.log(this.name);
10  }
11}
12
13let m1: Male = new Male("张三", 20);
14let m2: Male = {
15  name: "张三",
16  age: 20,
17  getName(this: Male) {
18    console.log(this.name);
19  },
20};
21m2.getName();
22let fn = m2.getName;
23fn(); // 报错,this指向并不是Male对象