JavaScriptの仕組みを詳しく解説

この記事では主にJavaScriptの動作原理の詳細な理論分析と知識ポイントの共有を行っていますので、興味のある方はぜひ学んでください。

JavaScript は、オブジェクトベースの弱い型指定のスクリプト言語 (以下、JS と呼びます) であり、Java/C++ や他のコンパイル言語などの他のプログラミング言語とは異なります。記事全体が最初にコンパイルされ、バイトコード (マシンコード) にコンパイルされます。その後、実行します。 JS はこれを行いません。JS は中間コードにコンパイルする必要はありませんが、ブラウザーで直接実行できます。JS の実行プロセスは、コンパイルと実行の 2 つの段階に分けることができます。 (書籍『あなたの知らない JS』を参照してください)、JS コントローラーが実行可能コードの一部に切り替わると (この実行可能コードはコンパイル フェーズ中に生成されます)、対応する実行コンテキスト (実行) が作成されます。コンテキストは EC と略されます）。実行コンテキストは、実行環境として理解できます（実行コンテキストは、JS インタプリタによってのみ作成でき、JS インタプリタによってのみ使用できます。ユーザーは「オブジェクト」を操作できません）。

JS の実行環境は 3 つのカテゴリに分類されます。

• グローバル環境: JS エンジンがコード ブロックに入るとき、<script>xxx</script> タグに遭遇すると、グローバル実行環境

• 関数環境: 関数が呼び出されるとき、関数内に関数実行環境が形成されます

• eval(): 文字列をJSコードとして単独で実行することは推奨されません

。

1 つの JS コード内で複数の実行コンテキストが生成されることがあります。JS では、実行コンテキストを管理するためにスタックなどのデータ構造が使用されます。スタックの特性は「先入れ、後出し、後入れ、先出し」です。この種のスタックは関数呼び出しスタックと呼ばれます。

実行コンテキストの特徴

• スタックの一番下は常にグローバル実行コンテキストです

• グローバル実行コンテキストは、ブラウザが閉じているときにのみスタックをポップアップします

• 。その他の実行コンテキスト 数に制限はありません

• スタックの先頭は常に現在アクティブな実行コンテキストであり、残りは実行が完了するとすぐにポップされ、その後待機状態になります。制御は次の実行コンテキストに戻されます

• 関数はそれぞれにのみ存在します。関数が呼び出されたときにのみ実行コンテキストが作成されます。関数が宣言された時点では実行コンテキストはありません。

実行コンテキストは、通常の JS オブジェクトとして明確に理解できます。実行コンテキストのライフサイクルには、大きく 2 つのステージがあります:

作成ステージ

このステージでは、主に 1. 変数オブジェクトの作成 2. の 3 つのイベントが完了します。スコープチェーンを確立する 3. このフェーズのポイントを決定する

実行フェーズ

このフェーズでは、主に変数の代入、関数の呼び出しなどの操作が完了します

変数オブジェクト(VO)の作成プロセス

• 1によると。関数パラメータに引数オブジェクトを作成して初期化し、初期値が未定義の引数オブ​​ジェクトに属性「0」、「1」、「2」、「3」などを追加し、arguments.lengthの値を設定します。渡されるパラメータの実際の数に。

• 2. 関数関数宣言を見つけて、変数オブジェクトに属性を追加します。属性名は関数名、属性値は関数の参照値です。同じ名前の関数が既に存在する場合は、それを上書きします。直接

• 3. var 変数の宣言を検索します (変数を検索する場合、関数のパラメータは var 宣言に相当するため、パラメータ名と同じ属性が VO に追加され、初期値は属性名は変数名です。同じ名前の識別子がすでに存在する場合、その識別子は処理されません。同じ名前が存在する場合、関数は変数よりも高い優先順位を持ちます。変数オブジェクト (OV) とアクティベーション オブジェクト (AO) は同じものであり、名前は異なります。作成期間中は変数オブジェクト、実行期間中はアクティブ化オブジェクトと呼ばれます。

  実行コンテキストの構造は大まかに次のとおりです。作成されると、それはすぐに関数呼び出しスタックにプッシュされます。この時点で、インタープリターは、現在の VO に関数を追加するという 1 つのことを実行します。上記のスコープ チェーンを指す内部プロパティ [[scope]]。

var g_name="tom";
var g_age=20;
function g_fn(num){
 var l_name="kity";
 var l_age=18;
 function l_fn(){
  console.log(g_name + '===' + l_name + '===' + num);
 }
}
g_fn(10);

実行フェーズ

式が見つかると、コードは行ごとに実行され、見つかった場合はそれが返されます。見つからない場合は、グローバル VO オブジェクトが終了するまで VO オブジェクトの検索が続けられます。

このステージには、変数の代入、関数呼び出し、その他の操作が含まれます。インタープリターは g_fn() に遭遇すると、これが関数呼び出しであることを認識し、すぐにその関数実行コンテキスト fn_EC を作成します。このコンテキスト fn_EC も同様です。 has 2 つのフェーズ

は、作成フェーズと実行フェーズです。

作成フェーズでは、関数実行コンテキストの変数オブジェクトを作成するときに、追加の引数オブ​​ジェクトが作成され、その引数オブ​​ジェクトに属性が追加されます: "0"、"1"、"2" の初期値値は未定義であり、function関数関数宣言

• find変数宣言

• 関連の推奨事項：

javaScriptランニングメカニズムサンプルコード分析

JavaScriptの実行仕組み Event Loop_javascriptスキルの詳細説明

以上がJavaScriptの仕組みを詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。