ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript のリフティング動作と原理の分析

JavaScript のリフティング動作と原理の分析

黄舟
黄舟オリジナル
2017-02-28 14:43:13942ブラウズ

JavaScript を学んだばかりの学生にとって、その動作の一部は混乱するかもしれません

学校で学んだ C/C++ とは大きく異なります
たとえば、この場合

a = 1;var a;console.log(a);// 1

一部の学生は、そうすべきだと考えるかもしれませんはい、var a が a に再割り当てされているようです
これが再び当てはまる場合は

console.log(a);// undefinedvar a = 1;

a が宣言される前に出力されるため、エラーであるか、ブラウザの動作に基づいて 2 が出力されるはずです上記
ただし、結果は未定義です

表示されるコードの順序は、必ずしも JS エンジンによって実際に実行される順序とは限りません
これが、今日話したい JavaScript の改善動作です
実は、この記事の執筆はプリコンパイルの補足です知識
読む前に プリコンパイルについて知らない方は、以下をクリックしてください
JavaScriptのプリコンパイル
JavaScriptのプリコンパイルはプロモーション動作に直結します

プロモーション動作

実際、プリコンパイルを理解した後、理由を明確に理解する
実行前にプリコンパイルが発生する Compile
したがって、これら 2 つのコード ブロックを実行するときは、次のようなコードを実行するのと同じです

var a;a = 1;console.log(a);// 1
var a;console.log(a);// undefineda = 1;

この昇格動作については、次の 2 つの文を覚えておいてください
変数宣言の昇格、関数宣言全体の昇格
もう一度強調します

function demo(){….}这才叫做函数声明 
var demo = function(){….}这不叫函数声明

実際、プリコンパイルの原理を理解していれば、プロモーション動作は簡単に理解できます

私たちは var a = 1 をステートメントとして扱うことに慣れていますvar a = 1 看做一个声明
可是js引擎却不这么认为,它会把它拆成var = a声明 与 a = 1しかし、JS エンジンはそうは考えず、それを var = a に分割します。宣言は a = 1 で初期化されます
、最初はコンパイル段階のタスクであり、 2 つ目は実行フェーズのタスクです
したがって、宣言がスコープ内にどのようなものであっても、実行前にすべての場所が事前に処理されます
これは、変数宣言と関数宣言をスコープの先頭に移動するのと同じです
このプロセスはリフティング

プログラミングプロセス中に、同じ名前の関数や通常の変数はもちろんのこと、変数を重複して宣言してはなりません
ちなみに、スコープの先頭に var を付けて変数を宣言するのは良い習慣です(単一変数原則)
このようにして、昇進行動について心配する必要はありません

分析例

それでも、面接の質問の焦点でもあるこのプロセスを理解する必要があります
古い質問を見てみましょう-流行の例を見てみましょう

function a(a, b){
    console.log(a);    console.log(c);
    c = 0;    console.log(b);
    var c;
    a = 3;
    b = 2;    console.log(a);    console.log(c);    console.log(b);    function b(){};
    console.log(b);
}
a(1);

混乱しているかも知れませんが、abc がたくさんあります
正解は次のとおりです:

1   undefined    function b(){}    3    0    2    2

ところで、まずプリコンパイルから分析しましょう

  1. AO オブジェクト (アクティブ オブジェクト) を作成します。

  2. 関数内の仮パラメーターと変数宣言を検索します。 仮パラメーター名と変数名は、AO オブジェクトの属性として使用されます

  3. 。実パラメータと仮パラメータは統一されており、実パラメータの値が仮パラメータに代入されます

  4. 関数宣言を見つけて、関数名はAOオブジェクトの属性として使用され、その値が関数参照になります

最後の関数 a が実行される前 生成された AO オブジェクトは次のようになります

//伪代码AO->{
    a: 1
    b: function(){}
    c: undefined}

したがって、このような関数を実行することと同じです
(関数名 a は内部の変数と競合しません)

function a(){    var a = 1;    var b = function(){};    var c;

    console.log(a);//1
    console.log(c);//undefined
    c = 0;
    console.log(b);//function(){}
    a = 3;
    b = 2;
    console.log(a);//3
    console.log(c);//0
    console.log(b);//2
    console.log(b);//2}

それで答えが得られます簡単に

変数宣言と関数宣言が同じ名前の場合
関数宣言が変数宣言をオーバーライドする必要があります(JavaScript関数はさまざまな権限の最初の市民です)
変数宣言が同じ名前の場合別の変数宣言として
、または関数宣言が別の関数宣言と同じ名前を持つ
それが誰です。文書の下で誰が優先権を持ちますか

概要

上記は、今日皆さんに共有する JavaScript のプロモーション動作です
2 つの文で要約します: 変数宣言の促進、全体的な関数宣言の促進
実際には、これは JS エンジンのプリコンパイルによって引き起こされる避けられない動作です

上記は JavaScript の改善動作と原則の分析です。 PHP 中国語 Web サイト (www.php.cn)!


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