TypeScript 自作のClassにイベントリスナーを使いたい

よく忘れる。検索エンジンは便利すぎるので、Class を DOM の方として教えてくれるやつ。

タイトルには TypeScript とあるが、JavaScript でも、というやつ。

developer.mozilla.org

class MyEventTarget extends EventTarget {
    constructor() {
        super();
    }
    test() {
        const event = new CustomEvent("foo", { detail: 1 });
        this.dispatchEvent(event);
    }
};
const ev = new MyEventTarget();
ev.addEventListener("foo", (e) => {
    console.log("Event foo:", e);
});
ev.test();

サンプル。

TypeScript: プレイグラウンド - TypeScriptとJavascriptを探求するためのオンラインエディタ