【TypeScript】TypeScriptの継承

TypeScriptの継承

• TypeScriptでは、あるクラスを拡張して、特化したクラスを作れます
  • 継承は 1つのクラスのみ
  • 継承元のクラスのプロパティやメソッドを全部引き継ぐ事ができます
• 継承元のクラスを親クラス/スーパークラス（super class）、継承するクラスをサブクラス（sub class）と言います

class subClass extends superClass {
}

• subClassにコンストラクタを作らない状態でnewすると、親クラスのコンストラクタがよばれます

サブクラス独自のコンストラクタ・プロパティを作成する

• super で、親クラスのコンストラクタを呼び出し、実行する事ができます

//部署を表す親クラス
class Department {

  private employees: string[] = [];

  constructor(private readonly id: string, public name: string) {
  }

  describe(this: Department) {
    console.log('Department (${this.id}): ${this.name}');
  }

  addEmployee(employee: string) {
    this.employees.push(employee);
  }

  printEmployeeInformation() {
    console.log(this.employees.length);
    console.log(this.employees);
  }
}

• サブクラス独自のコンストラクタ・プロパティを作成

//サブクラス独自のコンストラクタを作成

class ITDepartment extends Department {
  admins: string[]; 

  constructor(id: string, admins: string[]) {
    super(id, 'IT');      //superで親クラスのコンストラクタを呼び出す
    this.admins = admins; //サブクラス独自のプロパティ
  }
}


//独自プロパティをもつサブクラスを生成
const it = new ITDepartment('d1', ['CAT']);

const it = new ITDepartment('d1', ['CAT']);
it.addEmployee('NEKKO');
it.addEmployee('WANKO');

console.log(it); //サブクラス独自のプロパティに加え、親クラスのプロパティをもつ

サブクラス独自のメソッドを作成する

• 親クラスのメソッドに加え、サブクラス独自メソッドを作成できます

//サブクラス2 会計部門 - 独自メソッド追加
class AccountingDepartment extends Department {
  constructor(id: string, private reports: string[]) {
    super(id, 'Accounting');
  }

  addReport(text: string) {
    this.reports.push(text);
  }

  printReports() {
    console.log(this.reports);
  }
}

//独自メソッドを実行可能
const accounting = new AccountingDepartment('d2', []);
accounting.addReport('Reportだよ');
accounting.printReports(); //Reportだよ

サブクラスから、親クラスのプロパティにアクセスする

• 親クラスのプロパティを、protected 修飾子にする事で、サブクラスからアクセスできます
• protected 修飾子：クラス内部と、そのクラスを継承したクラスから、アクセスできる修飾子です
  • cf: private修飾子では、サブクラスから、アクセスできない

//親クラス
class Department {

  //employeesは、クラス内部と、そのクラスを継承したクラスから、アクセスできる
  protected employees: string[] = [];  

  constructor(private readonly id: string, public name: string) {
  }

  addEmployee(employee: string) {
    this.employees.push(employee);
  }
}

親クラスのメソッドのオーバーライドする

• 親クラスのメソッドを引き継ぎ、書き換えることも可能です

//親クラス
class Department {

  //employeesは、クラス内部と、そのクラスを継承したクラスから、アクセスできる
  protected employees: string[] = [];  
  constructor(private readonly id: string, public name: string) {

  }

  addEmployee(employee: string) {
    this.employees.push(employee);
  }
}

//メソッドを override するサブクラス
class AccountingDepartment extends Department {
  constructor(id: string, private reports: string[]) {
    super(id, 'Accounting');
  }

//override
  addEmployee(name: string) {
    if (name === 'Max') {
      return;
    }

    //employeesはprotectedなので、サブクラスからemployeesにアクセスできる
    this.employees.push(name); 
  }
}

accounting.addEmployee('MofuiNeko');
accounting.addEmployee('MofuMofuInu');