# variable hoisting

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

{% hint style="success" %}

* [var](https://lochiwei.gitbook.io/web/js/scope/hoist/variable/var "mention")
  * [id](https://lochiwei.gitbook.io/web/js/grammar/token/id "mention")： <mark style="color:yellow;">**hoisted**</mark> to the <mark style="color:yellow;">**top**</mark> of its enclosing [function](https://lochiwei.gitbook.io/web/js/scope/function "mention").\
    ( 👉 [in-block-cant-shadow](https://lochiwei.gitbook.io/web/js/variable/declare/var/in-block-cant-shadow "mention"):exclamation:)
  * [val](https://lochiwei.gitbook.io/web/js/val "mention")： <mark style="color:yellow;">**initialized**</mark> to [undefined](https://lochiwei.gitbook.io/web/js/val/prim/undefined "mention"):exclamation:
* [let-const](https://lochiwei.gitbook.io/web/js/scope/hoist/variable/let-const "mention")
  * [id](https://lochiwei.gitbook.io/web/js/grammar/token/id "mention")： <mark style="color:yellow;">**hoisted**</mark> to the <mark style="color:yellow;">**top**</mark> of its [..](https://lochiwei.gitbook.io/web/js/scope "mention").
  * [val](https://lochiwei.gitbook.io/web/js/val "mention")： <mark style="color:red;">**uninitialized**</mark>:exclamation:(<mark style="color:yellow;">**referencing**</mark> it <mark style="color:red;">**before init**</mark> causes [<mark style="color:red;">**ReferenceError**</mark>](https://lochiwei.gitbook.io/web/js/err/ref/cannot-access-before-init))
    {% endhint %}

{% tabs %}
{% tab title="⭐️ 重點" %}
{% hint style="warning" %}
in the same [..](https://lochiwei.gitbook.io/web/js/scope "mention"), [function](https://lochiwei.gitbook.io/web/js/scope/hoist/function "mention") has <mark style="color:yellow;">**higher priority**</mark> over [variable](https://lochiwei.gitbook.io/web/js/scope/hoist/variable "mention"). ( :point\_right: [first](https://lochiwei.gitbook.io/web/js/scope/hoist/function/first "mention"):exclamation:)
{% endhint %}
{% endtab %}

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

* [var](https://lochiwei.gitbook.io/web/js/scope/hoist/variable/var "mention")
* [let-const](https://lochiwei.gitbook.io/web/js/scope/hoist/variable/let-const "mention")
* <mark style="color:yellow;">**related topics**</mark>
  * [declare](https://lochiwei.gitbook.io/web/js/variable/declare "mention")
    {% endtab %}

{% tab title="👥 相關" %}

* compare： [function](https://lochiwei.gitbook.io/web/js/scope/hoist/function "mention")
  {% endtab %}

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

* [ ] [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;
  * [ ] [Ch. 1](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch1.md#chapter-1-whats-the-scope) ⟩ [Hoisting](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch1.md#hoisting)
  * [ ] Ch. 5 ⟩ [Hoisting: Declaration vs. Expression](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch5.md#hoisting-declaration-vs-expression)
  *

{% endtab %}
{% endtabs %}