Ghostwu シンプルでわかりやすい JavaScript 変数プロモーション-jsチュートリアル-php.cn

Ghostwu シンプルでわかりやすい JavaScript 変数プロモーション

巴扎黑

リリース： 2017-08-05 13:29:10

オリジナル

1337 人が閲覧しました

1 a = 'ghostwu';2 var a;3 console.log( a );

ログイン後にコピー

上記の例では、コードの 3 行目の出力結果は未定義であると思われるかもしれません。これは、2 行目は変数を宣言していますが、値を割り当てていないためです。 a は未定義ですが、結果は正しいです。理由については、読み続けてください。

1 console.log( a );2 var a = 'ghostwu';

ログイン後にコピー

上記のコードの最初の行では、出力前にエラーが報告されていると思われるかもしれません。 a、a 変数は定義されていませんが、正しい結果は未定義です。

その理由を理解するには、まず次の 2 つの点を明確にする必要があります:

JavaScript コードは 1 行ずつ実行されません。
JavaScript の実行は 2 つのステップに分かれています:

コンパイル (語彙的説明) /pre-explanation)
実行

次に、変数を定義するために var a = "ghostwu" に遭遇すると、実際、js はこの文を 2 段階の問題として扱います。var a は、コンパイルフェーズでは、a = 'ghostwu' が実行フェーズで発生します。その後、var a は現在のスコープの先頭に昇格され、a = 'ghostwu' は実行フェーズを待機するため、次のようになります。

1 a = 'ghostwu';2 var a;3 console.log( a );4 5 //上面这段代码经过编译之后，变成下面这样6 7 var a;  //被提升到当前作用域的最前面8 a = 'ghostwu'; //留在原地，等待执行9 console.log( a );

ログイン後にコピー

コンパイルされたコードを読んで理解できましたか?

以下に進む前に、まず関数を定義する 2 つの一般的な方法を明確にしましょう:

1 console.log( a ); 
2 var a = 'ghostwu';3 4 //上面这段代码,经过编译之后，变成下面这样5 6 var a;7 console.log( a );8 a = 'ghostwu';

ログイン後にコピー

なぜなら、式と関数宣言はコンパイル段階で異なる解釈効果を持つからです。

1         //函数声明, 形如:2         function show(){3             console.log( '函数声明方式' );4         }5 6         //函数表达式, 形如:7         var show = function(){8             console.log( '表达式方式' );9         }

ログイン後にコピー

コンパイル段階で上記のコードを説明するにはどうすればよいですか?次の文を覚えておいてください:

関数宣言はプロモートされます

したがって、上記のコードがコンパイルされると、次のようになります:

1         show();2         function show(){3             console.log( a );4             var a = 'ghostwu';5         }

ログイン後にコピー

したがって、上記の結果は未定義です ;

関数の場合次の例を参照してください:

       function show(){    //函数声明被提升到 当前作用域的最前面
            var a;    //var声明被提升到当前作用域的最前面, 注意，他不会提升到函数的外面, 因为当前的作用域是在函数中            console.log( a );
            a = 'ghostwu';
        }
        show();

ログイン後にコピー

 1 show(); //报错,show is not a function 2 var show = function(){ 3  console.log( 'ghostwu' ); 4 } 5 //对于上面这段表达式代码，经过编译之后: 6 var show; 7 show();  //执行之后就是 undefined(), 所以在表达式定义之前，调用函数报错了 8 show = function(){ 9   console.log( 'ghostwu' );  
10 }

ログイン後にコピー

なぜ上記のコードの結果は「Hello」ですか?

理由: 同じ名前が出現する場合、関数宣言、変数の場合が宣言されている場合、関数宣言が最初にプロモートされ、変数宣言は無視されます。したがって、コンパイル後は次のようになります:

1         show(); //你好2         var show;3         function show(){4             console.log( '你好' );5         }6         show = function(){7             console.log( 'hello' );8         }

ログイン後にコピー

以下のように、同じ名前の関数宣言がある場合、後者の関数宣言が前の関数宣言を上書きします。

以上がGhostwu シンプルでわかりやすい JavaScript 変数プロモーションの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。