ホームページ > 記事 > ウェブフロントエンド > JavaScriptの基礎知識まとめ (8) コンパイル前実行処理
今回は JavaScript の基礎知識まとめをお届けします。 基礎的な JavaScript の知識まとめ (8) 実践的なケースを見てみましょう。
JS 実行三部作
ステップ 1: 構文分析
パート 2: プリコンパイル
パート 3: 解釈と実行
プリコンパイル
構文分析は意味分析とも呼ばれ、構文分析は記事全体ですたとえば、実行のプロセス。これらのコードは実行されると、1 行ずつ解釈されて実行されます。ただし、システムは実行の最初のステップでコードをスキャンします。 は、低レベルの構文エラーです。たとえば、括弧や漢字などが少ない場合、テキスト全体をスキャンしますが、この全文スキャン プロセスは、スキャン後の構文解析と呼ばれます。全文だとプリコンパイルして一行解釈してから実行します 一行、つまり説明と実行
プリコンパイル前置きimply global 暗示全局变量: 即任何变量,如果变量未经声明就赋值,自变量就位全局对象所有 eg : a = 123; eg : var a = b = 123;宣言されたグローバル変数は全て
eg:var a = 123;===> window.a = 123; //例子: function test (){ console.log("a"); } test();//成功打印出a, box();//写在方法之前也成功打印出a,为什么能执行就是有预编译的过程 function box (){ console.log("a"); } var a =123; console.log(a);//输出123 console.log(a);//输出undefined,不报错; var a = 123; //但是如果直接打印会报错; console.log(b)//报错 //也是预编译的效果 //如果想偷懒记住两句话 //函数声明整体提升 //变量 声明提升改善点を説明します。関数宣言の説明: 関数宣言を記述する場合、どこに記述しても、システムは常にこの関数をロジックの先頭に持ってくるため、どこで呼び出しても、上または下で呼び出されても、基本的にはこれは関数の下で呼び出され、常に関数の宣言をプロモートします。ロジックの先頭に移動します変数宣言は、たとえばvar a = 123;//実際には 2 つの部分です。 of var a;//最初に変数を宣言します
a = 123;//変数に値を代入します
function a(a){ var a = 123; var a = function(){ } a(); }var a = 123;これはこれら 2 つの文では解決できません 上記を説明する前に、まず impiy global とは何かを理解する必要がありますimply globa: 暗黙グローバル変数: つまり、宣言されずに変数に値が割り当てられた場合、独立変数がすべてのグローバル オブジェクトの代わりになります例: a = 123; 例: var a = b = 123; a = 10; console.log(a); // 10 を出力し、window 属性に 10 を指定します。 var b = 20; // Window にはグローバル ドメインもあります
function fn (a){ console.log(a); var a = 123; console.log(a); function a (){}; console.log(a); var b = function (){ } console.log(b); } fn(1);この例では、パラメータ、変数、関数名をすべてaと呼びます まず、上書き現象が起こるのは確実です。これは、関数のプリコンパイルが関数の実行直前に実行されると言われていることと非常に矛盾しています まず、プリコンパイル
。最初のステップ: AO オブジェクトを作成します。フルネームは です。 Activation オブジェクトはスコープであり、実行コンテキストとも呼ばれます
AO{ }
ステップ 2: 仮パラメータと変数宣言を見つけ、変数名と仮パラメータ名を AO 属性名として使用します。値は未定義です
AO{ a : undefined b : undefined }
ステップ3: 実パラメータの値を変更します仮パラメータで統一します
AO{ a : 1; b : undefined }
ステップ4: 関数本体内の関数宣言を見つけて、関数本体に値を代入します
AO{ a : 1, b : undefined, //b是是函数表达式,不是函数声明,所以不变 //然后有a了 有b了,然后将这个函数声明的名作为AO对象挂起来 d : }//然后值赋予函数体,也就是把a和b的属性值,变成函数体//覆盖掉a 和b的的属性值//也就变成下面的//因为第四步的优先级最高AO{ a : function a () {} b : undefined, //b是是函数表达式,不是函数声明,所以不变 d : function d () {} }
この時点で、プリコンパイルプロセスが終了し、コードの実行を開始し、関数を実行します
次に、上記の例を見ていきます
//预编译结果AO{ a : function a () {} b : undefined, d : function d () {} }//开始执行代码function fn (a){ //第一步开始打印a //根据上面预编译的结果, //所以打印结果是function a () {} console.log(a); //第二步执行 var a = 123; //因为在预编译的第二步里面,变量已经提升了 //所以第二步只执行的赋值 //a = 123;去AO对象里面去找a //也就变成 //AO{ //a : 123 这个才是a的存储值 //b : undefined, //d : function d () {} //} var a = 123; //所以打印出123 console.log(a); //因为这句在话在预编译的时候系统已经看了 //所以不在看这句话 function a (){}; //所以下面的console.log(a) //还是打印123; console.log(a); //一样下面的var b这句话在预编译的时候已经看了,所以不在看 //AO{ //a : 123 //所以b的值变成function(){} //b : function(){} //d : function d () {} //} var b = function (){ } //所以打印出function(){} console.log(b); }
fn(1);
例を見ていきます
function test(a , b){ console.log(a); c = 0; var c; a = 3; b = 2; console.log(b); function b () {} console.log(b); }//这下我们就很快的得出打印的东西//a-->1//b-->2//b-->2
プリコンパイルは行われません関数本体でのみ発生しますが、グローバル コンテキストでも発生します
グローバル コンテキストの最初のステップは、最初に GO グローバル オブジェクトを生成することです。他は同じです
GO === window
次に問題は、 GO が先か、AO が先か
答えは、GO を先に実行することです
この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。 !
関連書籍:
JavaScriptの基礎知識のまとめ(6) 関数、初期スコープ(前編) JavaScriptの基礎知識のまとめ(6) 関数、初期スコープ(後編) JavaScriptの基礎知識まとめ(7)再帰以上がJavaScriptの基礎知識まとめ (8) コンパイル前実行処理の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。