Engineer's Way

主にソフトウェア関連について色々書くブログです。

TypeScriptでグローバル関数(windowオブジェクトのメソッド)を追加する

 

(やるべきかどうかは置いておいて)
TypeScriptでwindowオブジェクトにメソッドを追加したいとします。
単純に書くとこうなります。

window.hoge = () => console.log('abc');

これをコンパイルしようとすると、以下のようなエラーが出ます。

% npx tsc hoge.ts
hoge.ts(1,8): error TS2339: Property 'hoge' does not exist on type 'Window'.

これを回避するためには、以下のように書きます。

interface Window { hoge(message): void; }
declare var window: Window;

window.hoge = (message: string) => {
  console.log('called hoge');
};

呼び出すときはこうなります。

(<any>window).hoge('test');