ホームページ >ウェブフロントエンド >フロントエンドQ&A >JavaScriptのプリコンパイルとは何ですか

JavaScriptのプリコンパイルとは何ですか

WBOYオリジナル: 2022-03-10 11:02:532034ブラウズ

JavaScript におけるプリコンパイルとは、コードを実行する前に行われる操作で、変数宣言や関数宣言を事前に進めて、作成したオブジェクトに一定の規則に従って組み込んでいきます。

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

JavaScript のプリコンパイルとは何ですか

js で trilogy を実行する

1. 構文分析: js エンジンは js コードを解析する前に、テキスト全体をスキャンして Make low を見つけます。 -レベルの構文エラー (間違って書かれた中括弧など)。

2. プリコンパイル。すべての構文とステートメントはオブジェクト、GO (グローバルオブジェクト)、AO (アクティブオブジェクト) に変換されます。コードは、特定のルールに従って GO と AO に配置されます。

3. 解釈と実行: 1行ずつコンパイルと実行を行い、構文解析に問題がなくコンパイル前段階が完了したら、コードの解釈と実行を開始します。プリコンパイルのようなものですか？

プリコンパイルとは、JavaScript コードの前に実行される変数宣言や関数宣言を進める操作で、これらのコードは、作成されたオブジェクト内に一定の規則に従って配置されます。

プリコンパイルプロセス:

GO ウィンドウのプリコンパイル

1、スクリプトタグが実行された瞬間に GO オブジェクトを作成します

2、見てください変数宣言の場合、変数名は GO オブジェクトの属性名として使用され、値は未定義です。

3, 関数宣言を探します。関数名は GO オブジェクトの属性名として使用され、値は関数本体です。関数名が変数名と同じ場合は、直接オーバーライドします。

AO 関数のプリコンパイル

1、関数の実行時に AO オブジェクトを作成します。

2、実際のパラメーターと仮パラメーターを探し、仮パラメーターをオブジェクトは AO オブジェクトの属性名であり、値は実際のパラメータであることに注意してください。はい、関数宣言は変数とは呼ばれません。実際のパラメータ値がない場合、その値は未定義です。

3、変数宣言を探します。変数名は AO オブジェクトの属性名として使用され、値は未定義です。変数名と仮パラメータ名が同じであっても、心配する必要はありません。

4, 関数宣言を探します。関数名は AO オブジェクトの属性名として使用され、値は関数本体です。関数名が変数名と同じ場合は、上書きします。

簡単に紹介するコードを書いてみましょう Yiha 関数のプリコンパイルのプロセス

function fun(a,b){
    console.log(a);
    var a = 10;
    console.log(a);
    function a(){}
    console.log(a)
    a = 1;
    var b;
    console.log(b);
    var b = function(){}
    console.log(b);
}
fun(1,2);

1 まず fun を実行する前に AO オブジェクトを作成します。

funAO{
}

2、実パラメータと仮パラメータを探し、仮パラメータを AO オブジェクトの属性名としてオブジェクトに追加し、その値が実パラメータです。は変数とは呼ばれません。実際のパラメータ値がない場合、その値は未定義です。

funAO{
    a : 1,
    b : 2
}

3、変数宣言を探します。変数名は AO オブジェクトの属性名として使用され、値は未定義です。変数名が仮パラメータ名と同じ場合は、心配しないでください

funAO{
    a : 1,
    b : 2
}

4。関数宣言を探します。関数名は AO オブジェクトの属性名として使用され、値は次のとおりです。関数本体関数名が変数名と同じ場合は直接上書きします

funAO{
    a : function a(){},
    b : 2
}

説明と実行

function fun(a,b){
    console.log(a);  //往上面的AO对象里面寻找，a的值是function a(){}。 这里就输出function a(){}
    var a = 10;
    console.log(a);//上面一行代码把a赋值10 ，所以这里输出10
    function a(){}
    console.log(a)//这里也是10，因为上面函数已经提前了
    a = 1;
    var b;
    console.log(b);//往上面的AO对象里面寻找，b的值是2。 这里就输出2
    var b = function(){}//这里的函数为啥不能提前，因为这里的是一个函数表达式，这个函数没有函数名所以不能提前。
    console.log(b);//这里把b赋值function(){},所以这里输出function(){}
}
fun(1,2);

別の可能性もあります

function add(){
//这里的话碰到if判断，for....除了function作用域之外的咱们都得正常分析，
//所以这里的值为undefined其实就是var a提前了赋值undefined
    console.log(a);//这里的输出结果为？undefined
    if(a){
        var a = 10;
    }
    //这里是把a的值传入判断里面undefined返回的是false所以进不去，值就不会改变这里还是undefined
    console.log(a);//undefined
}
add();

これはプリコンパイルされた実行プロセス!

JavaScriptのプリコンパイルとは何ですか

JavaScript のプリコンパイルとは何ですか

関連記事