実行コンテキスト


📚 実行コンテキスト
:実行コードに入力する環境情報を含むオブジェクト
  • 構成方法
    :グローバルスペース、eval()関数、関数
    グローバルコンテキストは、個別の実行コマンドがなくてもブラウザで自動的にアクティブになります.

  • プロセスの実行
  • JavaScriptエンジンは、同じ環境内のコードを実行するときに、コンテキストを整理するために必要な環境情報を収集します(実行コンテキストオブジェクトに格納されます).
  • をcallスタックに積み上げます.
  • 呼び出しスタックの一番上のコンテキストに関連するコードを実行します.
  • 情報収集
  • VariableEnvironment
    - environmentRecord (snapshot)
    - outerEnvironmentReference (snapshot)
  • LexicalEnvironment
    - environmentRecord
    - outerEnvironmentReference
  • ThisBinding
  • JavaScriptエンジンでのみ作成され、開発者はコードで検証できません.
    💡 VariableEnvironment
    :現在のコンテキスト内の識別子に関する情報+外部環境情報.宣言時のLexicalEnvironmentスナップショットは、変更を反映しません.
    実行コンテキストを作成するときは、まずVariableEnvironmentに情報を入れ、元の場所にコピーしてLexicalEnvironmentを作成し、主にLexicalEnvironmentを使用します.
    💡 LexicalEnvironment
    :最初はVariableEnvironmentと同じですが、変更はリアルタイムで反映されます.
    💡 thisBinding
    :実行コンテキストでは、this Bindingはthisによって指定されたオブジェクトを格納します.
    コンテキストの開始時にthisが指定されていない場合、thisはグローバルオブジェクトを格納します.また、関数を呼び出す方法によって、ここに格納されるターゲットも異なります.//次章で詳述する.
    📚 環境記録と転送
    グローバル実行コンテキストは、変数オブジェクトを作成するのではなく、JavaScriptによって駆動される環境によって個別に提供されるオブジェクト、すなわちグローバルオブジェクト(brower:window,Node.js:global)を使用します.
    💡 environmentRecord
    :現在のコンテキストに関連するコードの識別子情報を格納します.
    - 매개변수 식별자 
    - 선언한 함수 자체
    - var로 선언된 변수의 식별자
    💡 hoisting
    変数情報の収集が完了しても、実行コンテキストに関連するコードは実行前の状態です.JavaScriptエンジンは、コードが実行される前でも、その環境内のすべてのコード変数名を知っています.
    Hoistingは、環境記録の収集プロセスをコードセットの最上位層に抽象化し、コード分析をより簡単に行うための環境記録収集プロセスを抽象化する概念です.
    マスク規則
    function a (x) {
    	console.log(x); // 1
        var x;
        console.log(x); // 1
        var x = 2;
        console.log(x); // 2
    }
    a(1)
    EnvironmentRecordは、どの識別子(宣言)があるかにのみ関心を持っています.したがって、変数を呼び出すと、変数名だけが上昇し、割り当てプロセスは元の場所に保持されます.
    上のコードは次の形式に変換されます.
    function a (x) {
    	var x; // 메모리에서는 저장할 공간을 확보하고, 주소값을 변수 x에 연결해둔다.
      	var x; //이미 선언된 변수 x가 있으므로 무시한다.
      	var x; //이미 선언된 변수 x가 있으므로 무시한다.
    
      	x = 1; // 1을 별도의 메모리에 담고, 이 주솟값을 변수 x에 연결한다.
      	console.log(x);
      	console.log(x);
      	x = 2; // 2를 별도의 메모리에 담고, 이 주솟값을 변수 x에 연결(1의 주솟값과 대치)한다.
     	console.log(x) 
        // 함수 내부의 모든 코드가 실행됐으므로 실행 컨텍스트가 콜 스택에서 제거된다.
    }
    次のコードを見てください.
    function a () {
    	console.log(b); // [Function: b]
      	var b = 'bbb';
      	console.log(b); // bbb
      	function b () {}
        console.log(b); // bbb
    }
    関数宣言は、関数全体を昇格させます.
    上のコードは次の形式に変換されます.
    function a () {
    	var b // 저장 공간을 확보하고, 확보한 공간의 주소값을 변수 x에 연결해둔다.
        var b = function b () {} 
        // 이미 선언된 변수가 있으므로 선언 과정은 무시한다. 
        // 함수는 별도의 메모리에 담기고 이 함수가 저장된 주솟값을 변수 b와 연결한다.
        
    	console.log(b);
      	b = 'bbb'; // 변수 b에 문자열 'bbb'가 담긴 주솟값으로 덮어쓴다.
      	console.log(b);
        console.log(b);
        // 함수 내부의 모든 코드가 실행됐으므로 실행 컨텍스트가 콜 스택에서 제거된다.
    }
    ➖関数宣言文と関数式
  • 関数宣言:
  • 関数定義子のみ、個別の割り当てコマンドはありません
  • 関数式:関数を別の変数に割り当てる
  • 記名関数式🚫 関数名は、関数内部からのみアクセスできます.
  • 匿名関数式
  • 関数宣言文と関数式の実質的な違いを見てみましょう.
    console.log(sum(1, 2)); // 3
    console.log(multiply(3, 4)); // TypeError: multiply is not a function
    
    function sum (a, b) {
      	return a + b;
    }
    
    var multiply = function (a, b) {
      	return a * b;
    }
    上のコードは次の形式に変換されます.
    var sum = function sum (a, b) { // 함수 선언문은 전체를 호이스팅한다.
    	return a + b;
    }
    var multiply; // 변수는 선언부만 끌어올린다.
    
    console.log(sum(1, 2));
    console.log(multiply(3, 4);
    
    multiply = function (a, b) { // 변수의 할당부는 원래 자리에 남겨둔다.
    	return a * b;
    }
    関数式は比較的安全です.
    📚 外部環境リファレンス
    scopeは識別子の有効範囲です.
    任意の境界Aの外部宣言の変数はAの外部およびAの内部からアクセスできますが、Aの内部宣言の変数はAの内部からのみアクセスできます.
    💡 scope chain
    :「識別子の有効範囲」を内側から外側に順に検索します.
    scope chainを可能にするのは外部環境参照です.
    💡 outerEnvironmentReference
    :outerEnvironmentReferenceは、現在呼び出されている関数宣言のLexicalEnvironmentを参照します.
    宣言動作が実際に発生する可能性のある時点は、呼び出しスタック内の実行コンテキストがアクティブな場合にのみ発生します.
    outerEnviornmentReferenceには、接続リストの形式が表示されます.
  • 「宣言ポイントのLexicalEnvironment」を参照し続けると、最後にグローバルコンテキストのLexicalEnvironmentが表示されます.
  • 最も近い要素から、順番に近づくしかありません.
    この構造特性により、複数のスキャンで同じ識別子が宣言された場合、スキャンチェーンで最初に発見された識別子に無条件にアクセスすることができる.
    次のコードの実行手順を見てみましょう.
    var a = 1;
    var outer = function () {
      	var inner = function () {
        	console.log(a);
        	var a = 3;
      	};
      	inner();
      	console.log(a);
    };
    outer();
    console.log(a);
  • グローバルコンテキストの有効化
    {a,outer}識別子を
  • 環境レコードに保存します.
  • グローバルコンテキストには宣言ポイントがないため、外部環境参照には何も含まれません.
  • グローバルスキャンにおける変数aは1を割り当て、outerは関数を割り当てる.
  • outer実行コンテキストの有効化
  • 環境レコードに{inner}識別子を保存します.
  • 外部環境参照は、グローバルコンテキストのLexicalEnvironmentへの参照レプリケーションを含む.
  • 外部スケールの変数内に関数を割り当てます.
  • 内部実行コンテキストの有効化
    {a}識別子を
  • 環境レコードに保存します.
  • EnvironmentReferenceはouter関数のLexicalEnvironmentを含む.
  • 4行目
    -識別子aに近づきたい.現在アクティブな内部連絡先の環境レコードでaを検索します.(
  • 、値が指定されていないため出力が定義されていない)
  • 5行目
    −3を内視鏡の変数aに割り当てる.
  • 内部関数の実行を終了
    内部実行コンテキストは呼び出しスタックから削除され、すぐに次の外部実行コンテキストが再アクティブになり、7行目の次の行に移動します.
  • 8行目
    識別子aに近づきたい.JavaScriptエンジンは、アクティブな実行コンテキストのLexicalEnvironmentにアクセスします.最初の要素のEnvironmentRecordでaを検索し、ない場合はOuterEnvironmentReferenceのEnvironmentRecordの検索を続行します.(グローバルLexicalEnvironmentにaがある)
  • outer関数の実行を終了
    外部実行コンテキストは呼び出しスタックから削除され、すぐに次のグローバルコンテキストが再アクティブになり、10行目の次の行に移動します.
  • 11行目
    識別子aに近づきたい.現在アクティブなグローバルコンテキストの環境レコードでaを検索します.(1出力)
  • コードが実行されました
    グローバルコンテキストは呼び出しスタックから削除され、終了します.
  • 変数の非表示
    上記の例では、内蔵a変数が宣言されているため、グローバル空間で宣言された同名のa変数にアクセスできません.これを変数隠匿化と呼ぶ.
    内部関数の内部からaにアクセスしようとすると、a識別子が存在するため、scopeチェーンの最初のパラメータである内部scopeのLexicalEnvironmentから検索を開始する必要があります.ここではa識別子が存在するため、scopeチェーンの検索は行われず、すぐにaに戻ります.
    ゾーン変数とグローバル変数
  • グローバル変数:グローバルscopeによって宣言された変数、aおよびouter
  • 領域変数:関数内部宣言変数、外部関数内部および内部関数内部のa
    外部にxという関数をもう1つ作成する場合は、outer関数を領域変数として宣言します.outer関数を呼び出すことができる領域はx内部に限られ、x関数内部のコードはグローバル空間にアクセスできません.