JavaScript の解明: ホイスティング、時間的デッド ゾーン、変数状態の詳細

以下に、魅力的でシンプルな 2 行のコードを示します。しかし、(JS の下線原則を無視したためなど) 非常に混乱するか、慰められるかのどちらかであることは保証できます。

ただし、以下のような知識概念が完全にロードされています

• 吊り上げ
• 時間的デッドゾーン
• 変数 (未宣言、未初期化、未定義) (ボーナス)

私の矛盾した発言
var、const、let と同様に、それらのプロパティもホイストしますが、それらは異なるゾーンにあります。

ホイスティング Def (シンプル/素人版)

1. 実際の宣言前に関数や変数にアクセスできます。

今度は、Js が 2 行のコードをコンパイルして実行する方法を詳しく説明します

JavaScript では、特に let と var を扱う場合、コンパイラーとエンジンが変数の宣言と代入を処理する方法が微妙に異なります。
指定されたコードのプロセスをコンパイラと実行の両方の観点から分析してみましょう:

name = 'ashu';
let name;

この時点で、JavaScript コードを作成すると、最初のパーサーとコンパイラーがコードをコンパイルしてから実行フェーズに入るということを明確にしています。

コンパイラーの視点
最初の行: name = 'ashu';

コンパイルフェーズ中、
JavaScript エンジンはコードを解析し、必要なスコープを作成します。
割り当て名 = 'ashu';

に注意してください。ただし、この段階ではエンジンはコードを実行しません。これは単に、name という名前の変数への代入の存在を記録するだけです。

名前が以前に宣言されていない場合、var 宣言はホイストされグローバルにアクセスできるため、コンパイラーはそれをグローバル変数 (グローバル スコープ内の var name) への代入として扱います。

2 行目: let name;

コンパイラが let 名を検出したとき。宣言では、name がブロックスコープである必要があることが認められています。

コンパイラは、名前が属するスコープの名前を一時デッド ゾーン (TDZ) に配置します
つまり、名前の存在は認識しますが、それを初期化されていないものとしてマークします。

let 宣言は var と同じ方法ではホイストされません。

代わりに、スコープ内にバインディングを作成し、宣言が実行されるときのみ初期化します。

実行の視点

最初の行: name = 'ashu';

JavaScript エンジンが割り当て名 = 'ashu'; を実行すると、
現在のスコープ内に名前が存在するかどうかをチェックします。 name は let で宣言されていますが、TDZ (Temporal Dead Zone) 内にあるため、 let 宣言が初期化される前にそれにアクセスしようとすると、ReferenceError.

が発生します。

したがって、この時点では、name は TDZ にあり、割り当て名 = 'ashu'; になります。 ReferenceError.

が発生します。

---

2 行目: let name;

この行はブロックスコープ内のname変数を初期化します。
この時点以降、name は TDZ 内になくなり、エラーなくアクセスまたは割り当てが可能になります。

今ならボーナスチップ

undeclare、未定義、未初期化の違い;

undeclare :- 変数はまだ宣言されていません。
未定義 :- 変数は宣言されていますが、初期化されていません;
初期化されていません :- 変数は定義されていますが、その値は後の部分で提供されます。

例:- const result = multiplyBy2(5);
関数の戻り値が結果に割り当てられるまで、その時点までは初期化されていないゾーンになります。

興味深い事実:-

ご存知のとおり、一時的なデッド ゾーンは最初は Const 用に装飾されていましたが、その後 **Let**

で採用されました。

参照:-

1. https://frontendmasters.com/courses/deep-javascript-v3 + GitHub の共同操縦者との私の例え

以上がJavaScript の解明: ホイスティング、時間的デッド ゾーン、変数状態の詳細の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。