ホームページ >ウェブフロントエンド >フロントエンドQ&A >JavaScript 変数のプロモーションとは何を意味しますか?

JavaScript 変数のプロモーションとは何を意味しますか?

青灯夜游
青灯夜游オリジナル
2022-02-07 14:00:024747ブラウズ

JavaScript における変数の昇格とは、変数のスコープ内で、変数がどこで宣言されているかに関係なく、その変数がスコープの先頭に昇格されますが、変数の初期化の順序は変更されないことを意味します。変数ホイスティングの実際の実装では、コンパイル段階で JavaScript の変数と関数の宣言がメモリに配置されます。

JavaScript 変数のプロモーションとは何を意味しますか?

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

変数プロモーションとは何ですか?

変数ホイスティング (ホイスティング) は、JavaScript 実行コンテキストがどのように機能するかについて人々が理解しているものであり、公式の変更ではありません。

文字通り理解すると、変数のプロモーションとは、変数と関数の宣言が物理層のスコープの前に移動されることを意味します。この理解は正確ではありませんが、効果は同じです。

平たく言えば、変数の昇格とは、変数のスコープ内で、変数が宣言されている場所に関係なく、その変数がスコープの先頭に昇格されますが、変数の初期化の順序は変わらないことを意味します。

変数プロモーションの実際の実装では、JavaScript の変数と関数の宣言がコンパイル段階でメモリに配置されます。これは、ユーザーが関数または変数を正式に宣言する前に使用できることを意味します。

##変数プロモーションの実装を理解するには、まず次の 2 つの点を明確にする必要があります:

    #JavaScript コードは行ごとに実行されません。
  • javascript の実行は 2 つのステップに分かれています:
    • コンパイル (字句解釈/事前解釈)
    • 実行
変数プロモーションは理解に役立ちます

console.log(a);
var a = 'ghostwu';
上記のコード例のコードの最初の行では、 a が出力される前に a 変数が定義されていないため、エラーが報告されますが、正しい結果は未定義です。実際のコードと組み合わせた JS 実行コードの上記の説明によると、変数を定義するために var a = "ghostwu" に遭遇すると、js は実際にはこの文を 2 つのステージとみなします。var a はコンパイル ステージで発生し、a = 'ghostwu' は実行フェーズで発生します。その後、var a が現在のスコープの先頭に昇格され、a = 'ghostwu' は実行フェーズを待機する位置に留まるので、次のケースを見てください:

 a = 'ghostwu';
 var a;
 console.log( a );
 
 //上面这段代码经过编译之后,变成下面这样

 var a;  //被提升到当前作用域的最前面
 a = 'ghostwu'; //留在原地,等待执行
 console.log( a ); //输出ghostwu
 
 
 
  console.log( a ); 
   var a = 'ghostwu';

   //上面这段代码,经过编译之后,变成下面这样
   
   var a;
  console.log( a );//输出undefined,而不会报错
   a = 'ghostwu';

関数宣言のプロモーション 関数宣言のプロモーションを説明する前に、まず関数を定義する 2 つの一般的な方法を理解しましょう

         //函数声明, 形如:
         function show(){
             console.log( '函数声明方式' );
         }
 
         //函数表达式, 形如:
         var show = function(){
             console.log( '表达式方式' );
         }

Because 関数式の宣言式と関数の解釈効果はコンパイル段階で異なるため、関数の宣言が昇格されます。例として、次のコードを参照してください:

         show();
         function show(){
             console.log( a );
             var a = 'ghostwu';
         }


//函数声明会被提升,所以上面的代码经过编译之后,就变成下面这样

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

ただし、関数式は昇格されません。以下の例:

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

しかし、次の場合を見てください:

show(); //你好
var show;
function show(){
console.log( '你好' );
}
show = function(){
   console.log( 'hello' );
}

なぜ上記のコードは "Hello" を出力するのでしょうか? それは、同じ名前の関数宣言または変数宣言が出現すると、関数がwill 宣言が最初にプロモートされ、変数宣言は無視されます。したがって、コンパイル後は次のようになります:

function show(){
   console.log( '你好' );
}
show(); //你好
show = function(){
  console.log( 'hello' );
}
show();//如果这里在调用一次,就是hello, 因为show函数体在执行阶段被重新赋值了

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

show(); //how are you
var show;
function show(){
console.log( 'hello' );
}    
show = function(){
console.log( '你好' );
}
function show(){
console.log( 'how are you!' );
}  

//上面的代码经过编译之后,变成如下形式:
function show(){
   console.log( 'how are you!' );
}
show(); //how are you
show = function(){
 console.log( '你好' );
}
show(); //如果在这里再执行一次,结果:你好

注:

  • #変数の昇格は変数の宣言のみを昇格し、代入は昇格しません。

  • 変数のプロモーションというものがあるため、変数のプロモーションによる悪影響を避けるために、変数を定義する際には let を使用することをお勧めします。 varの代わりに。

  • 【関連する推奨事項:
JavaScript 学習チュートリアル

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。