TypeScriptのクラス構文に関するメモ

TypeScriptのクラス構文に関するメモ

本とサイト見て軽くまとめました。
後から追記していく予定です。

クラスの定義

1. クラス構文を用いてクラスを定義する。
2. クラスに対してnewキーワードを使うと、オブジェクトを生成できる。
3. クラスを定義するとクラス名と同じ名前の型が同時に定義される。(初めて知った。)

// 1
class ClassName {
  variable1: string;
  variable2: number;

  constructor(variable1: string, variable2: number) {
    this.variable1 = variable1;
    this.variable2 = variable2;
  }
}

// 2
const class1 = new ClassName("test", 1);

// 3 
const class2: Class2 = new ClassName();

アクセス修飾子

アクセス修飾子を利用すると、プロパティ・メソッドに対して、アクセスの可否レベルを設定できる。

・public : クラスの外からも自由にアクセス可能(default値)
・protected : 同じクラス、派生クラスからのみアクセス可能
・private : 同じクラスからのみアクセス可能(接頭辞#をつけることでも可能)
・#とprivateの共存は不可能
・#はハードプライバシー, privateはソフトプライバシー

class ClassName {
  private variable1: string;
  protected variable2: number;

  constructor(variable1: string, variable2: number) {
    this.variable1 = variable1;
    this.variable2 = variable2;
  }

  public show(): string {
    return `${this.variable1} years old.`;
  }
}

const class1 = new ClassName("test", 1);

const class2: Class2 = new ClassName();

コンストラクタとプロパティ設定

以下のように記述することで、与えられた引数をもとにプロパティを初期化する。

class Person {
  construcotr(private name: string, private age: number) {}
}

getterとsetter

getter : privateプロパティの参照時に呼び出す。
setter : ↑の書き込みジに呼び出す。

利点

• setを省略すると読み取り専用のプロパティを、
  getを省略すると書き込み専用のプロパティを表せる。
• 値チェックや戻り値の加工などが可能。

get getVariable(): string {
  return this.variable;
}

set setVariable(param: string) {
  this.variable = param;
}

静的メンバー

static修飾子を利用
newしてクラスのインスタンスを作らずとも、クラスのプロパティ、メソッドを利用可能

メリット

• インスタンスを生成しなくても静的メソッドを実行可能
• 同じクラスから生成されたインスタンスが静的メンバを共有できる

特徴

1. クラスに紐づくメンバ(静的メンバ)
2. アクセスは「Class名.メンバ名」。非static内からの呼び出す場合もこの記述
3. static内からstaticなメンバにアクセスするには「this.メンバ名」
4. 静的メンバは型引数を参照できない

class Fire {
  public static status: string =  'burning';
}

console.log(Fire.status);

継承

元のクラスの機能(メンバー)を引き継ぎながら新しい機能を追加

継承元を親クラスをいい、継承によってできたクラスを派生クラスという。

派生クラスは親クラスのメソッドも呼び出せる。

class Person {
	name: string; 
	age: number;

	constructor(name: string, age: number){
		this.name = name:
		this.age = age;
	}
	show(): string {
		return `${this.name} is ${this.age} years old.`
	}
}

class BusinessPerson extends Person {
	work(): string {
		return `${this.name} is work hard.`
	}
}

オーバーライド

派生クラスで上書きする。

class BusinessPerson extends Person {
	protected clazz: string;
	constructor(name: string, age: number, clazz: string) {
		super(name, age);
		this.clazz = clazz;
	}

	show(): string {
		return super.show() + `${this.clazz}`
	}
}

抽象クラス

派生クラスで機能を上書きしなければならないようにするのが抽象メソッド
抽象メソッドを含んだclassブロックにもabstract修飾子を付与しなければならない
継承した場合、派生クラス側では抽象メソッドのオーバーライドが必須

abstract class MyClass {
	abstract test(): number;
	abstract msg: string;
}

参考
サバイバルTypeScript
速習TypeScript