# global scope

[JS](https://lochiwei.gitbook.io/web/js) ⟩ [scope](https://lochiwei.gitbook.io/web/js/scope) ⟩ global

{% hint style="success" %}
(in a programming [env](https://lochiwei.gitbook.io/web/js/concept/env "mention")) \
the [](https://lochiwei.gitbook.io/web/js/scope "mention") that <mark style="color:yellow;">**contains**</mark>, and is <mark style="color:yellow;">**visible**</mark> in, <mark style="color:orange;">**all other scopes**</mark>.
{% endhint %}

{% tabs %}
{% tab title="🔴 主題" %}

* [object](https://lochiwei.gitbook.io/web/js/scope/global/object "mention") - an [object](https://developer.mozilla.org/en-US/docs/Glossary/Object) that <mark style="color:orange;">**always**</mark> exists in the [global scope](https://developer.mozilla.org/en-US/docs/Glossary/Global_scope).
  * [this](https://lochiwei.gitbook.io/web/js/scope/global/object/this "mention") - identifier for the global object.
  * [window](https://lochiwei.gitbook.io/web/js/scope/global/object/window "mention") - global object in browser.
  * [self](https://lochiwei.gitbook.io/web/browser/api/worker/self "mention") - global object in web worker.
  * [global](https://lochiwei.gitbook.io/web/js/scope/global/object/global "mention") - global object in Node.js.
  * [prop](https://lochiwei.gitbook.io/web/js/scope/global/object/prop "mention")
* [variable](https://lochiwei.gitbook.io/web/js/scope/global/variable "mention")
* [dom-element-with-id](https://lochiwei.gitbook.io/web/js/scope/global/dom-element-with-id "mention")
* [is-in-global-scope](https://lochiwei.gitbook.io/web/js/scope/global/is-in-global-scope "mention") - check if current context is in global scope.
  {% endtab %}

{% tab title="⭐️ 重點" %}
{% hint style="danger" %} <mark style="color:purple;">**global scope**</mark>

* in <mark style="color:yellow;">**browsers**</mark>：<mark style="color:purple;">**global scope**</mark> <mark style="color:yellow;">**is**</mark> [top-level](https://lochiwei.gitbook.io/web/js/scope/top-level "mention"). &#x20;
* in <mark style="color:yellow;">**Node.js**</mark>：<mark style="color:purple;">**global scope**</mark> <mark style="color:red;">**is not**</mark> [top-level](https://lochiwei.gitbook.io/web/js/scope/top-level "mention").

👉 Node.js ⟩ ["global"](https://nodejs.org/api/globals.html#globals_global) ⭐️
{% endhint %}

{% hint style="warning" %}
in the <mark style="color:purple;">**global scope**</mark>, [var](https://lochiwei.gitbook.io/web/js/variable/declare/var)/[function](https://lochiwei.gitbook.io/web/js/val/func/declare) <mark style="color:yellow;">**declarations**</mark> also expose themselves as [prop](https://lochiwei.gitbook.io/web/js/val/obj/prop "mention") on the [object](https://lochiwei.gitbook.io/web/js/scope/global/object "mention").
{% endhint %}

{% hint style="success" %}
in <mark style="color:purple;">**global scope**</mark>, <mark style="color:yellow;">**JS**</mark> exposes its <mark style="color:yellow;">**built-ins**</mark>:

* <mark style="color:yellow;">**primitives**</mark>: [undefined](https://lochiwei.gitbook.io/web/js/val/prim/undefined "mention"), [null](https://lochiwei.gitbook.io/web/js/val/prim/null "mention"), `Infinity`, `NaN`
* <mark style="color:yellow;">**natives**</mark>: `Date`, [object](https://lochiwei.gitbook.io/web/js/val/builtin/object "mention"), [str](https://lochiwei.gitbook.io/web/js/val/prim/str "mention") ...
* <mark style="color:yellow;">**global functions**</mark>: [eval](https://lochiwei.gitbook.io/web/js/scope/global/object/eval "mention"), `parseInt()`...
* <mark style="color:yellow;">**namespaces**</mark>: `Math`, `Atomics`, `JSON` ...
* <mark style="color:yellow;">**friends of JS**</mark>: `Intl`, `WebAssembly` ...

📗 [You Don't Know JS yet](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch4.md#why-global-scope)
{% endhint %}

{% hint style="info" %}
each [env](https://lochiwei.gitbook.io/web/js/concept/env "mention") puts some of its own <mark style="color:yellow;">**built-ins**</mark> into the <mark style="color:purple;">**global scope**</mark>：

* [browser](https://lochiwei.gitbook.io/web/browser "mention")：
  * <mark style="color:blue;">**`console`**</mark>
  * [dom](https://lochiwei.gitbook.io/web/browser/dom "mention")： [window](https://lochiwei.gitbook.io/web/js/scope/global/object/window "mention"), `document`,  ...&#x20;
  * <mark style="color:yellow;">**timers**</mark>：`setTimeout(..)`,  ...
  * <mark style="color:yellow;">**web APIs**</mark>：`navigator`, `history`, geolocation, WebRTC,  ...
* [worker](https://lochiwei.gitbook.io/web/browser/api/worker "mention")：??? (anything else?)
* [node.js](https://lochiwei.gitbook.io/web/js/concept/env/node.js "mention")：???
  {% endhint %}

{% hint style="info" %}
A "[variable](https://lochiwei.gitbook.io/web/js/variable "mention")" is just a [prop](https://lochiwei.gitbook.io/web/js/val/obj/prop "mention") of the [environment-record](https://lochiwei.gitbook.io/web/js/concept/execution-context/lexical-environment/environment-record "mention") (associated with the <mark style="color:yellow;">**currently executing**</mark> [block](https://lochiwei.gitbook.io/web/js/grammar/statement/other/block "mention") /[func](https://lochiwei.gitbook.io/web/js/val/func "mention") /[module](https://lochiwei.gitbook.io/web/js/module "mention") /<mark style="color:yellow;">**script**</mark>).&#x20;
{% endhint %}

{% hint style="warning" %}
Functions created with the [**Function**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function#difference_between_function_constructor_and_function_declaration) <mark style="color:yellow;">**constructor**</mark> <mark style="color:red;">**always**</mark> are created in the <mark style="color:purple;">**global scope**</mark>. :point\_right: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function#difference_between_function_constructor_and_function_declaration)
{% endhint %}
{% endtab %}

{% tab title="🗺️ 圖表" %}

<div><figure><img src="https://ringojs.org/documentation/images/modulescope.png" alt=""><figcaption><p>✅ each module has its own scope </p></figcaption></figure> <figure><img src="https://ringojs.org/documentation/images/scriptscope.png" alt=""><figcaption><p>❌ global object shared by all scripts</p></figcaption></figure></div>
{% endtab %}

{% tab title="📗 參考" %}

* [x] ringojs ⟩ [Understanding module and global scope](https://ringojs.org/documentation/module_and_global_scope/) ⭐️
* [ ] [ydkjs-scope-and-closures-v.2](https://lochiwei.gitbook.io/web/master/ref/book/you-dont-know-js-series-v.2/ydkjs-scope-and-closures-v.2 "mention") ⟩&#x20;
  * [x] Ch. 3: [The Scope Chain](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch3.md#chapter-3-the-scope-chain)
  * [ ] Ch. 4: [Around the Global Scope](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch4.md#chapter-4-around-the-global-scope)
    {% endtab %}

{% tab title="📘 手冊" %}

* [ ] [Global scope](https://developer.mozilla.org/en-US/docs/Glossary/Global_scope)
* [ ] [Scope](https://developer.mozilla.org/en-US/docs/Glossary/Scope)
  {% endtab %}

{% tab title="🗣 討論" %}

* [What is the 'global' object in NodeJS](https://stackoverflow.com/a/52193294/5409815)
  {% endtab %}
  {% endtabs %}
