コンテンツにスキップ

JavaScript/globalThis

出典: フリー教科書『ウィキブックス(Wikibooks)』

globalThis は、JavaScript においてグローバルオブジェクトを参照するための標準的な方法です。これにより、コードがどの実行環境(ブラウザ、Node.js、Web Workers など)で実行されているかに関係なく、一貫してグローバルオブジェクトにアクセスできます。globalThis は ECMAScript 2019(ES10)で導入され、従来の環境依存の方法(例えば、ブラウザの window や Node.js の global など)に代わるものです。

グローバルオブジェクトとは、コードが実行される環境全体にわたって共有されるオブジェクトであり、グローバルスコープに存在する変数や関数、その他のオブジェクトが含まれます。

使用例

[編集]

以下のコードは、globalThis を使ってグローバルオブジェクトにアクセスする例です。どの実行環境でも同じように動作します。

console.log(globalThis);  // グローバルオブジェクト(ブラウザでは window、Node.js では global)

次のコードでは、グローバルオブジェクトに新しいプロパティを追加しています。

globalThis.myGlobalVar = 'Hello, world!';
console.log(globalThis.myGlobalVar);  // 'Hello, world!'

他のグローバルオブジェクトとの比較

[編集]

globalThis は、従来のグローバルオブジェクト(ブラウザでは window、Node.js では global)を一貫して参照するための新しい方法です。従来、グローバルオブジェクトにアクセスする方法は実行環境によって異なっていました。例えば、ブラウザでは window を使い、Node.js では global を使う必要がありました。しかし、これらの環境依存の方法は、クロスプラットフォームのコードを書く際に問題を引き起こす可能性がありました。

globalThis を使用することで、どの環境でも一貫してグローバルオブジェクトにアクセスできるため、環境に依存しないコードを書くことが容易になります。

if (typeof window !== 'undefined') {
  // ブラウザの場合
  console.log(window);
} else if (typeof global !== 'undefined') {
  // Node.jsの場合
  console.log(global);
} else {
  // その他の環境
  console.log(globalThis);
}

上記のコードは、環境に依存せずに globalThis を使用できることを示しています。

globalThis の導入背景

[編集]

globalThis は、異なる実行環境で動作するコードの互換性を確保するために導入されました。それ以前、ブラウザ、Node.js、Web Workers など、実行環境ごとに異なる方法でグローバルオブジェクトにアクセスする必要がありました。これにより、クロスプラットフォームのコードを書く際に混乱が生じることがありました。

ECMAScript 2019(ES10)で globalThis が導入され、これにより一貫してグローバルオブジェクトにアクセスするための標準的な方法が提供されました。

globalThis と他のグローバルオブジェクトの関係

[編集]

globalThis は、以下のような他のグローバルオブジェクトと密接に関連しています:

  • window: 主にブラウザ環境で使用されるグローバルオブジェクト。window は、グローバルスコープの変数や関数を保持します。
  • global: 主に Node.js 環境で使用されるグローバルオブジェクト。global は、Node.js の実行環境におけるグローバル変数や関数を保持します。

globalThis は、これらの環境依存のオブジェクトを抽象化し、どの環境でも一貫してアクセス可能にするための統一された方法を提供します。

仕様

[編集]
  • ECMAScript 2019(ES10)で導入
  • グローバルオブジェクトにアクセスする標準的な方法
  • クロスプラットフォーム対応のコードを簡素化

関連項目

[編集]

ブラウザサポート

[編集]

globalThis は、主要なブラウザおよび環境(例えば、最新のブラウザ、Node.js)でサポートされていますが、古いブラウザではサポートされていない可能性があります。以下の表に、globalThis のブラウザサポート状況を示します。

ブラウザ サポート
Chrome 70以降
Firefox 65以降
Safari 12.1以降
Edge 79以降
Node.js 12.0以降
Internet Explorer サポートなし