ロードだったりリサイズだったりのときのイベントリスナーのターゲット、今までは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
}
}
を指定する。