TypeScript 中的类
目录
一、TypeScript 类
TypeScript 是面向对象的 JavaScript。类描述了所创建的对象共同的属性和方法。TypeScript 支持面向对象的所有特性
1、类的定义
class class_name {
// 类作用域
}
类可以包含以下几个模块（类的数据成员）：
- 字段(属性) − 字段是类里面声明的变量。字段表示对象的有关数据。
- 构造函数 − 类实例化时调用，可以为类的对象分配内存。
- 方法 − 方法为对象要执行的操作
实例：
创建类的数据成员
以下实例我们声明了类 Car，包含字段为 engine，构造函数在类实例化后初始化字段 engine。
this 关键字表示当前类实例化的对象。注意构造函数的参数名与字段名相同，this.engine 表示类的字段。
此外我们也在类中定义了一个方法 disp()。
class Car {
// 字段
engine:string;
color:string;
// 构造函数
constructor(engine:string,color:string) {
this.engine = engine
this.color=color;
//成员函数
disp():void{ //void：表示函数无返回值(即函数体内部没有return语句)
console.log("引擎："+this.engine+",颜色："+this.color)
}
}
【注意】：this 关键字表示当前类实例化的对象。注意构造函数的参数名与字段名相同，this.engine 表示类的字段。
2、创建实例化对象
使用 new 关键字来实例化类的对象，语法格式如下：
var object_name = new class_name([ arguments ])
类实例化时会调用构造函数，例如：
var obj = new Car("Engine 1")
类中的字段属性和方法可以使用 . 号来访问：
// 访问属性
obj.field_name
// 访问方法
obj.function_name()
示例：
let bm = new Car('V8','红色') //调用构造方法,构造方法的作用是初始化对象
bm.disp()完整代码如下：
class Car {
engine:string;
color:string;
constructor(engine:string,color:string) {
this.engine = engine
this.color=color;
disp():void{
console.log("引擎："+this.engine+",颜色："+this.color)
}
}
let bm = new Car('V8','红色')
bm.disp()二、类的继承
TypeScript 支持继承类，即我们可以在创建类的时候继承一个已存在的类，这个已存在的类称为父类，继承它的类称为子类。
类继承使用关键字 extends，子类除了不能继承父类的私有成员(方法和属性)和构造函数，其他的都可以继承。
TypeScript 一次只能继承一个类，不支持继承多个类，但 TypeScript 支持多重继承（A 继承 B，B 继承 C）。
语法格式如下：
class 子类名 extends 父类名
类的继承：实例中创建了 Shape 类，Circle 类继承了 Shape 类，Circle 类可以直接使用 Area 属性：
//定义父类
class Shape {
circumference: number;
length: number;
constructor(r: number, a: number) {
this.length = r;
this.circumference = a;
}
}
//定义子类
class Circle extends Shape {
disp() {
console.log("正方形边长是：", this.length);
console.log("正方形周长是：", this.circumference);
}
}
let t1 = new Circle(5,20);
t1.disp();
关于类的继承在Ts和Js中都是使用extends关键字，并且在构造函数中使用super方法实现构造继承，这个方法都必须写在字类构造函数内的最前面。
Ts受保护的成员的使用方式就是通过添加到父类构造函数，然后字类构造继承该成员，在子类中就能使用this关键字访问该成员了，子类中不需要再在自生声明该成员了。
三、static 关键字
用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用。
例如：
class StaticMem {
static num:number;
static disp():void {
console.log("num 值为 "+ StaticMem.num)
}
}
StaticMem.num = 12 // 初始化静态变量
StaticMem.disp() // 调用静态方法四、类属性权限修饰符
TypeScript 中，可以使用访问控制符来保护对类、变量、方法和构造方法的访问。TypeScript 支持 3 种不同的访问权限。
1、public（默认属性）
- public（默认） : 派生类、类的实例对象都可以访问。
class Person{
public name:string;
public age:number;
constructor(name:strng,age:number){
this.name=name;
this.age=age;
}
cons(text:string){
console.log(`Hi! ${this.name},${text}`);
}
}2、protected（保护属性）
- protected (保护属性): 派生类可以访问、类的实例对象不可以访问。
class Person{
protected name:string;
public age:number;
constructor(name:strng,age:number){
this.name=name;
this.age=age;
}
}
class Man extends Person{
sex:string;
constructor(name:strng,age:number,sex:string;){
super(name,age)
this.sex=sex
}
cons(text:string){
console.log(`Hi! ${this.name},${text}`);
}
}
new Man("Cat"，12).name; // 错误,name是保护属性3、private（私有属性）
- private (私有属性): 派生类、类的实例对象不可以访问。
class Person{
private name:string;
public age:number;
constructor(name:strng,age:number){
this.name=name;
this.age=age;
}
cons(text:string){
console.log(`Hi! ${this.name},${text}`);
}
}
new Person("Cat"，12).name; // 错误: 'name' 是私有的.4、readonly（只读属性）
- readonly 修饰符：将属性设置为只读的。
class Person{
readonly name:string;
public age:number;
constructor(name:strng,age:number){
this.name=name;
this.age=age;
}
}
let dad =new Person("Cat"，12);
dad.name = "小明"; // 错误! name 是只读的.Ts类与Js类的修饰符对比：
- Ts有公共成员（public）修饰符；Js没有该修饰符，但可以在构造函数constructor内直接使用this定义公共成员，用于生成每个实例对象的属性。
- Ts有私有成员（private）修饰符；Js的私有成员修饰符是（#），该成员只能在当前类中使用，TS与JS没有区别。
- Ts有受保护成员（protected）修饰符；Js没有该修饰符，也没有对应的成员语法。在Ts中受保护成员可以被字类访问在子类中使用，但不能被实例对象在外部访问。
- Ts有静态成员（static）修饰符；Js中也有同样的修饰符，该成员最终被解析到类的自身属性上（解析成ES5的话就是函数的属性），静态属性可以被类名直接在任何地方引用。
- Ts有只读成员（readonly）修饰符；Js中没有该修饰符，但是可以通过属性访问器get来实现。