> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/js/err/ref/cannot-access-before-init.md).

# cannot access 'xxx' before initialization❗️

[JS](/web/js.md) ⟩ [error](/web/js/err.md) ⟩ [ReferenceError](/web/js/err/ref.md) ⟩ cannot access '...' before initialization

{% hint style="danger" %}
:no\_entry: <mark style="color:red;">**ReferenceError**</mark>：[<mark style="color:yellow;">**cannot access '...' before initialization**</mark>](/web/js/err/ref/cannot-access-before-init.md):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](/web/js/val/type/name/typeof.md) on [lexical declaration](/web/js/grammar/declare/lexical-declaration.md) ([let](/web/js/variable/declare/let.md)/ [const](/web/js/variable/declare/const.md)/ [class](/web/js/val/class.md)) in its [temporal dead zone](/web/js/variable/access/tdz.md) will throw a [<mark style="color:red;">**ReferenceError**</mark>](/web/js/err/ref/cannot-access-before-init.md).&#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="👥 相關" %}

* [temporal dead zone](/web/js/variable/access/tdz.md)
* [undeclared identifier](/web/js/grammar/token/id/undeclared.md)
  {% 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 error](/web/js/err/runtime.md).

```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/class hoisting](/web/js/scope/hoist/variable/let-const.md) - uninitialized variable.
* [initial value](/web/js/variable/declare/initial-value.md) ⟩ [initial value](/web/js/variable/declare/initial-value.md#fan-li) - improper declaration.
* [typeof let/const/class in TDZ gets an error❗️](/web/js/variable/access/tdz/typeof-let-const-class-in-tdz-gets-an-error.md)
  {% endtab %}
  {% endtabs %}
