TypeScript的类

1. 类的定义

TypeScript中的类和ES6中类的定义类似，但是也有区别

class Person {
  name: string; // 和JAVA类似,要先在这声明对象中拥有的属性和类型,这里的分号很重要
  /*
    该属性定义相当于public name:string;
    只不过省略了public,下面再做解释
  */
  constructor(n: string) {
    this.name = n; // 和ES6一样,传入构造函数,只不过需要在前面先定义this的属性
  }

  run(): void {
    console.log(this.name);
  }
}

let p: Person = new Person("张三"); // 可以对实例类型变量进行类型的定义,也可以默认不写为any
let Person2: typeof Person = Person; // 把Person类赋值Person2
// typeof Person是表明该对象是一个Person类的类型,而不是Person的实例类型
let p2: Person = new Person2('tt'); // 因为Person2也是Person类型的类,所以可以这样实例对象
p.age = 18; // 报错,类只允许有name属性
p.run(); // 张三

对象属性设置的时候需要在后面打上分号表示结尾，不像JS中对象写法

constructor函数后面不能加上返回值的修辞符，否则会报错，可以看作是固定写法

函数定义完成后不需要加上符号分割

2. 类的继承

类的继承和接口不同，一个类只能继承一个父类

class Person {
  name: string;
  constructor(n: string) {
    this.name = n;
  }
  run(): void {
    console.log(this.name);
  }
}

class Student extends Person { // 类的继承可以说和ES6完全一样,只是constructor需要指定类型
  age: number;
  constructor(name: string, age: number) {
    super(name);
    this.age = age;
  }
  work() {
    console.log(this.age);
  }
}
let s = new Student("李四", 18);
s.run();
s.work(); // 18

如果子类里的方法和父类方法名一致，那么在使用的时候会使用子类的方法，不会使用父类的方法了

3. 类的修辞符

在TypeScript中定义属性或方法的时候为我们提供了四种修辞符

  • public：公有类型，在类、子类、类外部都可以对其访问

    这里的在类外部访问就是在实例化过后能在类的外界单独打印该属性，而不是只在内部的方法中使用该属性

  • protected： 保护类型，在类、子类里可以对其进行访问，但是在类的外部无法进行访问

  • private：私有类型，在类里面可以访问，在子类和类的外部都无法访问

    • TypeScript使用的是结构性类型系统，当我们比较两种不同的类型时，并不在乎它们从何处而来，如果所有成员的类型都是兼容的，我们就认为它们的类型是兼容的
    • 当我们比较带有 private或 protected成员的类型的时候，如果其中一个类型里包含一个private成员，那么只有当另外一个类型中也存在这样一个 private成员，并且它们都是来自同一处声明时，我们才认为这两个类型是兼容的。对于 protected成员也使用这个规则
    class Animal {
  private name: string;
  constructor(theName: string) { this.name = theName; }
}

class Rhino extends Animal {
  constructor() { 
    super("Rhino"); 
  }
}

class Employee {
  private name: string;
  constructor(theName: string) { this.name = theName; }
}

let animal = new Animal("Goat");
let rhino = new Rhino();
let employee = new Employee("Bob");

animal = rhino; // 能够赋值,因为两者兼容,都是同一个私有属性name

animal = employee; // 错误: Animal 与 Employee 不兼容,name的私有属性不兼容


`readonly`：只读类型，可以使用 `readonly`关键字将属性设置为只读的,。只读属性必须在声明时或构造函数里被初始化

```typescript
class Octopus {
  readonly name: string;
  readonly numberOfLegs: number = 8;
  constructor(theName: string) {
    this.name = theName;
  }
}

let dad = new Octopus("Man with the 8 strong legs");
dad.name = "Man with the 3-piece suit"; // 错误! name 是只读的.

如果属性不添加修饰符，默认为公有属性(public)

// public
class Person {
  public name: string;
  constructor(n: string) {
    this.name = n;
  }
  public run(): void {
    console.log(this.name);
  }
}

class Student extends Person {
  constructor(name: string) {
    super(name);
  }
}
let s = new Student("李四");
console.log(s.name); // 李四
s.run(); // 李四

// protected
class Person {
  protected name: string;
  constructor(n: string) {
    this.name = n;
  }
  public run(): void { // 如果这个方法是protected,下面的s.run()也会报错
    console.log(this.name);
  }
}

class Student extends Person {
  constructor(name: string) {
    super(name);
  }
}
let s = new Student("李四");
console.log(s.name); // 报错
s.run(); // 李四

如果构造函数也可以被标记成 protected，意味着这个类不能在包含它的类外被实例化，但是能被继承

class Person {
  protected name: string;
  protected constructor(theName: string) { this.name = theName; }
}
// Employee 能够继承 Person
class Employee extends Person {
  private department: string;

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

  public getElevatorPitch() {
    return `Hello, my name is ${this.name} and I work in ${this.department}.`;
  }
}
let howard = new Employee("Howard", "Sales");
let john = new Person("John"); // 错误:因为'Person' 的构造函数是被保护的.

// private
class Person {
  private name: string;
  constructor(n: string) {
    this.name = n;
  }
  run(): void {
    console.log(this.name);
  }
}

class Student extends Person {
  constructor(name: string) {
    super(name);
  }
  work(): void {
    console.log(this.name);
  }
}
let s = new Student("李四");
console.log(s.name); // 报错
s.work(); // 报错
s.run(); // 李四,因为run方法是Person内部的,可以使用私有属性

参数属性

参数属性通过给构造函数参数前面添加一个访问限定符来声明。 使用 private限定一个参数属性会声明并初始化一个私有成员，对于 public和 protected来说也是一样

总的来说，这种写法是上面先声明又赋值属性的简便写法，可以直接通过这种写法改写上方先先在前面声明属性的写法，构造函数中也可以什么都不写

  • 声明了一个构造函数参数及其类型

  • 声明了一个同名的公共属性

  • 当我们 new出该类的一个实例时，把该属性初始化为相应的参数值

    class Octopus {
  readonly numberOfLegs: number = 8;
  constructor(readonly name: string) { // 通过这种写法改变上面对应readonly的例子
  }
}

4. 寄存器

TypeScript中也可以对一个属性时用get和set方法对一个属性内部的获取和赋值进行拦截

let passcode = "secret passcode";

class Employee {
  private _fullName: string;
  get fullName(): string { // 对fullName属性进行拦截
    return this._fullName;
  }
  set fullName(newName: string) {
    if (passcode && passcode == "secret passcode") {
      this._fullName = newName;
    } else {
      console.log("Error: Unauthorized update of employee!");
    }
  }
}

let employee = new Employee();
employee.fullName = "Bob Smith";
if (employee.fullName) {
  alert(employee.fullName);
}

只带有 get不带有 set的存取器自动被推断为readonly类型的属性

5. 静态方法和属性

class Person {
  public name: string;
  constructor(n: string) {
    this.name = n;
  }
  run(): void {
    console.log(this.name);
  }
}

class Student extends Person {
  static name1: string; // 设置静态属性
  constructor(name: string) {
    super(name);
    Student.name1 = this.name; // 赋值
  }
  static work(): void { // 静态方法
    console.log(Student.name1);
  }
  work(): void {
    console.log(Student.name1);
  }
}
let s = new Student("李四");
console.log(Student.name1); // 李四
Student.work();
s.work(); // 李四

6. 抽象类

TypeScript中的抽象类是提供其他类继承的基类，不能直接被实例化，只能被其他类所继承

用abstract关键字定义抽象类和抽象类中的抽象方法或属性，抽象类中的抽象方法不包含具体实现，但是必须要在派生类，也就是继承的类中实现抽象方法，抽象属性不需要赋值，并且继承的类不能够扩展自己的方法和属性

总的来说，抽象类和抽象方法只是用来定义一个标准，而在其子类在必须要实现这个标准，并且不能扩展抽象类中没有的标准。否则会报错

用abstract声明的抽象方法只能放在抽象类中。否则会报错

abstract class Department {
  abstract age: number;
  constructor(public name: string) { // 参数属性的一个应用
  }

  printName(): void {
    console.log('Department name: ' + this.name);
  }

  abstract printMeeting(): void; // 必须在派生类中实现
}

class AccountingDepartment extends Department {
  public age: number = 18;
  constructor() {
    super('Accounting and Auditing'); // 在派生类的构造函数中必须调用 super()
  }
  printMeeting(): void {
    console.log('The Accounting Department meets each Monday at 10am.');
  }
  generateReports(): void {
    console.log('Generating accounting reports...');
  }
}

let department: Department; // 允许创建一个对抽象类型的引用
department = new Department(); // 错误: 不能创建一个抽象类的实例
department = new AccountingDepartment(); // 允许对一个抽象子类进行实例化和赋值
console.log(department.age); // 18
department.printName();
department.printMeeting();
department.generateReports(); // 错误: 方法在声明的抽象类中不存在
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 213,254评论 6赞 492
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 90,875评论 3赞 387
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 158,682评论 0赞 348
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 56,896评论 1赞 285
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 66,015评论 6赞 385
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 50,152评论 1赞 291
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 39,208评论 3赞 412
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 37,962评论 0赞 268
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 44,388评论 1赞 304
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,700评论 2赞 327
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,867评论 1赞 341
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 34,551评论 4赞 335
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 40,186评论 3赞 317
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,901评论 0赞 21
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,142评论 1赞 267
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 46,689评论 2赞 362
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 43,757评论 2赞 351