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对象