TypeScriptはクラスに対するイベントをサポートしていますか?
2023-10-06 12:16:39
質問
TypeScriptでは、クラスやインターフェイスにカスタムイベントを定義することができるのでしょうか?
これはどのようなものでしょうか?
どのように解決するのですか?
このように簡略化したイベントをプロパティとして使用するのはどうでしょうか。 所有するクラスの型付けが強くなり、継承も不要になります。
interface ILiteEvent<T> {
on(handler: { (data?: T): void }) : void;
off(handler: { (data?: T): void }) : void;
}
class LiteEvent<T> implements ILiteEvent<T> {
private handlers: { (data?: T): void; }[] = [];
public on(handler: { (data?: T): void }) : void {
this.handlers.push(handler);
}
public off(handler: { (data?: T): void }) : void {
this.handlers = this.handlers.filter(h => h !== handler);
}
public trigger(data?: T) {
this.handlers.slice(0).forEach(h => h(data));
}
public expose() : ILiteEvent<T> {
return this;
}
}
のように使用します。
class Security{
private readonly onLogin = new LiteEvent<string>();
private readonly onLogout = new LiteEvent<void>();
public get LoggedIn() { return this.onLogin.expose(); }
public get LoggedOut() { return this.onLogout.expose(); }
// ... onLogin.trigger('bob');
}
function Init() {
var security = new Security();
var loggedOut = () => { /* ... */ }
security.LoggedIn.on((username?) => { /* ... */ });
security.LoggedOut.on(loggedOut);
// ...
security.LoggedOut.off(loggedOut);
}
改善点は?
関連
-
[解決済み] TypeScript getting error TS2304: cannot find name ' require'.
-
[解決済み] TypeScriptで文字列を数値に変換する方法とは?
-
[解決済み] TypeScriptでオブジェクトに動的にプロパティを割り当てるには?
-
[解決済み] JSONオブジェクトをTypeScriptのクラスにキャストする方法を教えてください。
-
[解決済み] TypeScriptの "*.d.ts "について
-
[解決済み] Typescript によるインターフェース型チェック
-
[解決済み】TypeScriptのインターフェースと型について
-
[解決済み】TypeScriptのコンパイルでExperimental decoratorsの警告が出る。
-
[解決済み] Typescript はなぜ "export" というキーワードを使って、クラスやインターフェースを公開するのでしょうか?
-
[解決済み] Promise.all()をTypescriptで使用する方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] TypeScriptの予約語 "type "とは何ですか?
-
[解決済み] Angular 2で相対パスが非常に長いインポートを回避する方法とは?
-
[解決済み] TypeScript 2: 型付けされていない npm モジュールのためのカスタム型付け
-
[解決済み] ...は非モジュールのエンティティに解決され、このコンストラクトを使用してインポートすることはできません」とはどういう意味ですか?
-
[解決済み] TypeScriptの"=>"の意味とは?(ファットアロー)
-
[解決済み] 型{ [key: string]: boolean; }は何を意味するのでしょうか?
-
[解決済み] ユーティリティクラスの構成方法
-
[解決済み] VSCodeでTypeScriptの警告を無効にするには?
-
Typescriptでオブジェクトのキーと値の両方から型を取る
-
typescriptにおけるreflect-metadataとは?