《前端之路》- TypeScript (四) class 中各类属性、方法，抽象类、多态

一、TypeScript 中的类

1、先来举个例子：

class Persons {   name: any;   age: number | undefined;   constructor(name: string, age: number) {     this.name = name;     this.age = age;   }   getName(): void {     console.log(`${this.name}今年已经${this.age}岁了`);   } } let p11 = new Persons("za", 123); console.log(p11.getName()); // za今年已经123岁了

• 转换成 ES5 的代码后：

var Persons = /** @class */ (function() {   function Persons(name, age) {     this.name = name;     this.age = age;   }   Persons.prototype.getName = function() {     console.log(       this.name + "\u4ECA\u5E74\u5DF2\u7ECF" + this.age + "\u5C81\u4E86"     );   };   return Persons; })(); var p11 = new Persons("za", 123); console.log(p11.getName()); //  za今年已经123岁了

2、这里和我们使用 Es6 中的 class 有一些差别

// javascript 中 class 的定义 class An {   constructor(name) {     this.name = name;   }   getName() {     console.log(this.name);   } } var a = new An("zz"); a.getName(); // zz

3、差异在于，我们需要去定义 constructor 构造函数中传入的数据参数的类型

https://blog.csdn.net/lin123_00/article/details/106020831

二、TypeScript 中类的继承

class Animal {   name: string | undefined;   food: string;   constructor(name: string, food: string) {     this.name = name;     this.food = food;   }   eat() {     console.log(`${this.name}吃${this.food}`);   } } class Cat extends Animal {   constructor(name: string, food: string) {     super(name, food);   }   jump() {     console.log(`${this.name}正在跳`);   } } let xiaohhua = new Cat("xiaohua", "猫粮"); console.log(xiaohhua.eat()); // xiaohua吃猫粮 console.log(xiaohhua.jump()); // xiaohua正在跳

这里和 ES6 中的 class 继承内容基本上没什么出入