JavaScriptの自己実行無名関数のこの問題は何ですか？

ここにサンプルコードスニペットがあり、このスニペットの可能な出力を示し、その説明を提供する必要があるとします

var name = 'Zakir';
(() => {
   name = 'Rahul';
   return;
   console.log(name);
   function name(){
      let lastName = 'Singh';
   }
})();
console.log(name);

素朴なアプローチでこの問題を1行ずつ見ていきましょう

1→変数名に格納された「Zakir」

3→自己実行無名関数の内部に入ります

4→変数名が「Rahul」に再初期化されます

5→returnステートメントが検出されたため、関数を終了します

15→現在の値が「Rahul」である画面に名前変数を出力します

したがって、最終的な出力は

Rahul

しかし、残念ながら、それは間違っています。コードをもう一度調べて、どこが間違っているのかを確認しましょう。今回は、変数と関数の巻き上げの概念を念頭に置いてください。

1→変数名に格納された「Zakir」

3→自己実行無名関数の内部に入ります

関数に入ると、関数のホイストが実行され、自己実行関数の下部に定義されている関数name（）が自己実行関数の最上部にホイストされます。その中間状態では、コードは次のようになります。 / P>

例

let name = 'Zakir';
(() => {
   let name;
   name = 'Rahul';
   return;
   console.log(name);
   name = function(){
      let lastName = 'Singh';
   }
})();
console.log(name);

変数/関数がスコープの一番上に持ち上げられると、それは定義されて初期化されるだけであり、実際の位置で初期化され、一番上では未定義ですが、存在することに注意してください。

したがって、変数名が再初期化されると、再初期化されるのはローカル変数名であり、グローバル変数ではありません。その後、自己実行関数から戻り、グローバル変数名をコンソールに出力します。コンソールには「Zakir」が保持されています。したがって、出力は-

出力

Zakir