ホームページ > 記事 > ウェブフロントエンド > JavaScriptのプリコンパイルプロセスを完全にマスターする
この記事では、javascript のプリコンパイルに関する関連知識を提供します。主にプリコンパイルの関連問題を例を通して紹介します。皆様のお役に立てれば幸いです。
プロセスについて説明しますプリコンパイルプロセス
1. JavaScript コード実行前のプリコンパイル
JavaScript コードが実行される前に、まずグローバル オブジェクトが作成されます。 window (
Global Object) オブジェクトとして理解することもできます。このオブジェクトは表示できません (印刷できません) ため、すべて # と宣言されています。
##var が GO オブジェクトに配置され、割り当てられる値は
です未定義 (「変数プロモーション」を彷彿とさせます)
分析 **関数宣言:** 次に、すべての関数宣言を GO オブジェクトに入れ、関数自体の関数本体に値を代入します (関数名が属性名、値が関数本体 関数名と変数名が同じ場合は容赦なく上書きされます
)<script> var a = 1; console.log(a); console.log(b); var b = 10; function fun (a) { console.log(b); var a = b = 2; var c = 123; console.log(a); console.log(b); } var a2 = 20 fun(1); </script>
まず、
<script></script>GO = { //自带的属性都不写 }
will 宣言されたすべてのグローバル変数と、
を使用して宣言されていない変数は、GO オブジェクトに配置され、割り当てられます。値が 未定義
<pre class="brush:php;toolbar:false">GO = {
a : undefined,
b : undefined,
a2 : undefined
}</pre>
Anaization
GO = { a : undefined, b : undefined, a2 : undefined, function fun (a) { var a = b = 2; var c = 123; } }
この時、JSコード実行前のプリコンパイル処理が完了し、JSコードまず、
a に値 1GO = { a : 1, b : undefined, a2 : undefined, function fun (a) { var a = b = 2; var c = 123; } }
次に a を出力します。このとき、GO オブジェクト上に変数 a が見つかり、このときの a の値は 1 であるため、
console.log(a)であることがわかり、console.log(b) は 未定義
と等しくなります。 次に代入ステートメントを実行します:
## になります。 #
GO = { a : 1, b : 10, a2 : undefined, function fun (a) { var a = b = 2; var c = 123; } }
コードの次の行は **fun 関数ですが、この時点では実行されません。 を a2 に実行します:
a2 = 20、GO オブジェクトも変更されます:
GO = { a : 1, b : 10, a2 : 20, function fun (a) { var a = b = 2; var c = 123; } }
次に、
fun を実行します。 関数は、前述の別の時点で行われるプリコンパイルなど、関数が実行される前に行われますが、ここで関数が実行される前のプリコンパイルについて説明します。 2. 関数実行前のプリコンパイル
AO オブジェクトの生成 : 関数が実行される直前に、AO アクティブ オブジェクト
1 行ずつ実行します。
最初のステップは、AO オブジェクトを作成することですAO{ }
and
変数宣言; 注: fun 関数の b は var によって宣言されていませんなので、これはグローバル変数なので、
fun
形式パラメータに割り当てますAO{ a: undefined,//形参a与局部变量a同名 c: undefined }実際のパラメータを
AO{ a: 1, c: undefined, }
検索関数宣言は AO オブジェクトに配置され、関数本体として割り当てられます。fun 関数には関数宣言がないため、この手順は無視されます。
函数执行之前的预编译完成,开始执行语句
执行代码
首先执行打印变量b,而此时fun
的AO里边并没有变量b,所以会去GO对象里边找,此时的GO对象b的值为10,所以第一行代码打印出10;
第二行代码首先要看的是b = 2
,然后GO对象里边b的值就被改为2了。
GO = { a : 1, b : 10, a2 : 20, function fun (a) { var a = b = 2; var c = 123; } }
然后b再赋值给a,变量a是属于局部变量a,所以fun
的AO对象里边a的值被改为2。
AO{ a: 2, c: undefined, }
接着下一个赋值语句是c = 123
,所以AO对象中c的值被改为了123
AO{ a: 2, c: 123, }
此时再执行console.log(a)
的值就是AO对象里边a的值 2;执行console.log(b)
的值就是GO对象b的值 2,至此函数fun执行完毕,紧跟着fun的AO也会被销毁。
综上所述,依次打印出来的值为:1,undefined,10,2,2
。
undefined
)imply global(暗示全局变量-专业术语)
即:任何变量,如果未经声明就赋值,则此变量就位全局变量所有。(全局域就是window
,这里再一次说明了JavaScript是基于对象的语言,base on window
)window
的属性;var a=12;
等同于window.a = 12;
(会造成window
这个对象特别臃肿)相关推荐:javascript学习教程、web前端开发视频教程
以上がJavaScriptのプリコンパイルプロセスを完全にマスターするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。