グローバルオブジェクト

グローバル オブジェクトは、どこでも使用できる変数と関数を提供します。デフォルトでは、言語または環境に組み込まれています。

ブラウザーではwindowという名前が付けられ、Node.js ではglobalが付けられ、他の環境では別の名前が付けられる場合があります。

最近、 globalThisグローバル オブジェクトの標準化された名前として言語に追加され、すべての環境でサポートされる必要があります。すべての主要なブラウザでサポートされています。

ここでは環境がブラウザであると仮定して、 window使用します。スクリプトが他の環境で実行される可能性がある場合は、代わりにglobalThis使用することをお勧めします。

グローバル オブジェクトのすべてのプロパティには直接アクセスできます。

アラート("こんにちは");
// と同じです
window.alert("こんにちは");

ブラウザでは、 var ( let/constではありません!) で宣言されたグローバル関数と変数は、グローバル オブジェクトのプロパティになります。

 var gV​​ar = 5;

アラート(window.gVar); // 5 (グローバル オブジェクトのプロパティになります)

関数宣言にも同じ効果があります (関数式ではなく、メイン コード フロー内のfunctionキーワードを含むステートメント)。

そんなものに頼らないでください！この動作は互換性上の理由から存在します。最新のスクリプトでは JavaScript モジュールが使用されており、そのようなことは起こりません。

代わりにlet使用すると、そのようなことは起こりません。

 gLet = 5; とします。

アラート(window.gLet); // 未定義 (グローバル オブジェクトのプロパティにはなりません)

値が非常に重要であるためグローバルに利用できるようにしたい場合は、それをプロパティとして直接書き込みます。

 // 現在のユーザー情報をグローバルにし、すべてのスクリプトがアクセスできるようにします
window.currentUser = {
  名前：「ジョン」
};

// コード内の別の場所
アラート(現在のユーザー名);  // ジョン

// または、「currentUser」という名前のローカル変数がある場合
// ウィンドウから明示的に取得します (安全です!)
アラート(window.currentUser.name); // ジョン

ただし、グローバル変数の使用は一般的に推奨されません。グローバル変数はできるだけ少なくする必要があります。関数が「入力」変数を取得して特定の「結果」を生成するコード設計は、外部変数またはグローバル変数を使用する場合よりも明確で、エラーが発生しにくく、テストが容易です。

ポリフィルに使用する

グローバル オブジェクトを使用して、最新の言語機能のサポートをテストします。

たとえば、組み込みのPromiseオブジェクトが存在するかどうかをテストします (本当に古いブラウザには存在しません)。

 if (!window.Promise) {
  alert("あなたのブラウザは本当に古いです!");
}

何もない場合 (古いブラウザを使用している場合など)、「ポリフィル」を作成できます。環境ではサポートされていないが、最新の標準には存在する関数を追加します。

 if (!window.Promise) {
  window.Promise = ... // 最新言語機能のカスタム実装
}

まとめ

• グローバル オブジェクトには、どこでも使用できる変数が保持されます。

  これには、 Arrayなどの JavaScript 組み込み値や、ブラウザーのウィンドウの高さであるwindow.innerHeightなどの環境固有の値が含まれます。

• グローバル オブジェクトには、 globalThisユニバーサル名が付いています。

  …しかし、 window (ブラウザ) やglobal (Node.js) など、「昔ながらの」環境固有の名前で参照されることが多くなります。

• 値がプロジェクトにとって真にグローバルである場合にのみ、値をグローバル オブジェクトに保存する必要があります。そしてその数を最小限に抑えてください。

• ブラウザ内では、モジュールを使用していない限り、 varで宣言されたグローバル関数と変数はグローバル オブジェクトのプロパティになります。

• コードを将来にわたって使いやすく理解しやすくするには、グローバル オブジェクトのプロパティにwindow.xとして直接アクセスする必要があります。