カテゴリー
TypeScriptのInterfaceでStaticなクラスメソッドを適用させる方法
※ 当ページには【広告/PR】を含む場合があります。
2022/10/13
2つのinterfaceに分離して、別々に適用する方法
//👇通常のimplementでclassに実装させるinterface
interface IInstance {
instanceId: number;
instanceName: string;
instanceMethod(): void;
}
//👇Staticなメソッドと自己インスタンス化(new)を担当するコンストラクタの代役的interface
interface IStatic {
new(instanceId: number, instanceName: string): IInstance;
staticMethod(msg: string): void;
}
const HogeClass: IStatic = class HogeClass implements IInstance {
instanceId: number;
instanceName: string;
constructor(instanceId: number, instanceName: string){
this.instanceId = instanceId;
this.instanceName = instanceName;
}
instanceMethod(){
console.log(`Hello ${this.instanceName} of ID#${this.instanceId} Who Called from Instance Method in TS Class!`);
}
static staticMethod(msg: string) {
console.log(msg);
}
};
//👇通常のクラスメソッドの呼び出し
(new HogeClass(1, 'Hoge')).instanceMethod();
//👇スタティッククラスも利用可
HogeClass.staticMethod('Hello Somebody Who Called from Static Method in TS Class!');
Hello Hoge of ID#1 Who Called from Instance Method in TS Class!
Hello Somebody Who Called from Static Method in TS Class!
this
new(...): IInstance
クラスデコレータでコンストラクタ関数を置換する方法
tsconfig.json
{
//...中略
"compilerOptions": {
//...中略
"experimentalDecorators": true
}
}
//👇クラスデコレータの実装
function staticImplements<T>() {
return <U extends T>(constructor: U) => {constructor};
}
interface IStatic {
staticMethod(msg: string): void;
}
@staticImplements<IStatic>()
class HogeClass {
public static staticMethod(msg: string) {
console.log(msg);
}
}
HogeClass.staticMethod('Hello, Static Method in TS class!');
Hello, Static Method in TS class!
implements
@staticImplements
new HogeClass(...)
HogeClass
参考サイト
記事を書いた人
ナンデモ系エンジニア
主にAngularでフロントエンド開発することが多いです。 開発環境はLinuxメインで進めているので、シェルコマンドも多用しております。 コツコツとプログラミングするのが好きな人間です。
カテゴリー