カテゴリー
コーディング・プログラミング系

グローバルプロパティはglobalThisがよき


ロードだったりリサイズだったりのときのイベントリスナーのターゲット、今まではwindowだったりdocument.defaultViewだったりを書いていたけど、絶対にこの処理はブラウザ上でだけ動かす!(特定の指定じゃないと動かないなども含め)とかいうとき以外はglobalThisを使う。

globalThis.addEventListener( 'load', () => { ... } );

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/globalThis

globalThis プロパティは、環境を越えてグローバルな this 値 (すなわちグローバルオブジェクト自身) にアクセスするための標準的な方法を提供します。window や self などの同様のプロパティとは異なり、これはウィンドウのコンテキストでも非ウィンドウのコンテキストでも動作することが保証されています。この方法では、コードがどの環境で実行されているのかを知らなくても、一貫した方法でグローバルオブジェクトにアクセスすることができます。名前を覚えやすくするために、グローバルスコープでは this の値は globalThis であることを忘れないでください。

ESLintとかで怒られるときは、.eslintrcにて

{
	"globals": {
		"globalThis": true
	}
}

を指定する。