# cannot access 'xxx' before initialization❗️

[JS](../..) ⟩ [error](..) ⟩ [ReferenceError]() ⟩ cannot access '...' before initialization

{% hint style="danger" %}
:no\_entry: <mark style="color:red;">**ReferenceError**</mark>：[<mark style="color:yellow;">**cannot access '...' before initialization**</mark>](cannot-access-before-init):exclamation:
{% endhint %}

{% tabs %}
{% tab title="🧨 雷區" %}
* replit：[TDZ: let/const/class](https://replit.com/@pegasusroe/TDZ-letconstclass#index.js)

{% hint style="danger" %}
<mark style="color:yellow;">**using**</mark> [typeof](../../val/type/name/typeof "mention") on [lexical-declaration](../../grammar/declare/lexical-declaration "mention") ([let](../../variable/declare/let "mention")/ [const](../../variable/declare/const "mention")/ [class](../../val/class "mention")) in its [tdz](../../variable/access/tdz "mention") will throw a [<mark style="color:red;">**ReferenceError**</mark>](cannot-access-before-init).&#x20;

```javascript
// ⭐ temporal dead zone (start)
// ------------------------------
typeof aLet;       // ⛔ ReferenceError: Cannot access 'aLet' before initialization
typeof aConst;     // ⛔ ReferenceError: Cannot access 'aConst' before initialization
typeof aClass;     // ⛔ ReferenceError: Cannot access 'aClass' before initialization

typeof undeclared;        // ❗ 'undefined'

// ⭐ lexical declarations (let/const/class)
// --------------------------------------------
let aLet;                 // ⭐ initialized to `undefined`
const aConst = "hello";
class aClass {}
```
{% endhint %}
{% endtab %}

{% tab title="👥 相關" %}
* [tdz](../../variable/access/tdz "mention")
* [undeclared](../../grammar/token/id/undeclared "mention")
{% endtab %}

{% tab title="💈範例" %}
* replit：[hoisting & TDZ](https://replit.com/@pegasusroe/hoisting-and-TDZ#index.js)

{% hint style="danger" %}
referring to a variable before initialization causes a [runtime](../runtime "mention").

```javascript
const { log } = console;

function sayHi() {
    
    var greeting = "Hello";

    // block scope
    {
        
    // --------------------------
    // ⭐️ cause runtime error❗
    // --------------------------
        greeting = "Howdy";                              // ╮
    //  ^^^^^^^^                                         // ⭐️
    // ⛔ ReferenceError: (runtime error)                // Temporal
    //    Cannot access 'greeting'                       // Dead
    //    before initialization                          // Zone (TDZ)
                                                         // for `greeting`
                                                         // ╯
        
        let greeting = "Hi";   // ⭐️ `greeting` declared here❗
        
        log(greeting);
    }
    
}

log('hello');    // ✅ 'hello' (this line is OK)
sayHi();         // ⛔ run-time error
```
{% endhint %}
{% endtab %}

{% tab title="✨ 範例" %}
* [let-const](../../scope/hoist/variable/let-const "mention") - uninitialized variable.
* [initial-value](../../variable/declare/initial-value "mention") ⟩ [#fan-li](../../../variable/declare/initial-value#fan-li "mention") - improper declaration.
* [typeof-let-const-class-in-tdz-gets-an-error](../../variable/access/tdz/typeof-let-const-class-in-tdz-gets-an-error "mention")
{% endtab %}
{% endtabs %}
