JavaScript:メモリの観点からの関数スコープとスコープチェーンの説明

1.スコープ:変数の使用範囲

(1)グローバルスコープ:どちらもグローバル変数を指し、繰り返し使用されるという特徴がありますが、不適切な使用はグローバルな汚染を引き起こしやすいという欠点があります。
(2)関数スコープ:関数本体内でのみ有効なローカル変数を参照し、関数呼び出しが終了すると、変数のライフサイクルも終了します。欠点は、繰り返し使用できないことです。

第二に、関数スコープの下での関数ライフサイクル

例として次のコードを見てください:

	var a;
	function fun(){
		function text(){
			// to much coding
		}
		text();	
	}
	fun();
(1)関数が実行を開始する前に、メイン関数(main())を呼び出す実行環境スタック(ECS)を作成し、メイン関数がグローバルオブジェクトウィンドウを作成します。

実行開始前の環境です
ここに画像の説明を挿入

(2)ウィンドウのプリコンパイル(グローバルスコープ)

ここに画像の説明を挿入

(3)ウィンドウ内の関数が実行を開始します

①fun関数の定義:関数オブジェクトを作成し(windowで宣言された最初の関数はfun)、funは参照関数オブジェクトを指します。関数オブジェクトのスコーププロパティは、関数が作成されたときのスコープを参照します(ここでfun関数オブジェクトは参照します)ウィンドウ)
ここに画像の説明を挿入
②fun関数呼び出し:宣言と参照が完了すると、プログラムがfun()を実行すると、両方のfun()が呼び出されます。これは、ECSが新しい要素(新しい関数実行環境)fun()、funを開くことを意味します()次に、独自のアクティブオブジェクト(AO)を作成し、アクティブオブジェクトをポイントします。アクティブオブジェクトは、ローカル変数をfun()または新しい関数本体(fun()の内部関数テキストです)に格納します())、アクティブオブジェクトの親属性は、親スコープ(ここではウィンドウ)を指す関数のスコープ属性を参照します
ここに画像の説明を挿入
③テキスト関数定義:①と同様。テキストは参照関数オブジェクトを参照し、関数オブジェクトのスコーププロパティは関数作成のスコープを参照します(両方とも楽しい)
ここに画像の説明を挿入
④テキスト関数呼び出し:上記の②と同様、プログラムがテキストを実行するとき() 、両方のtest()が呼び出され、test()が独自のアクティブオブジェクト(AO)を作成し、アクティブオブジェクトを指します。アクティブオブジェクトの親属性は、関数のスコープ属性が親スコープを指します(ここでは楽しいです) :AO)。
ここに画像の説明を挿入

(4)ウィンドウ内の関数呼び出しが終了する

関数が実行された後の次のステップは、スタックをポップし、アクティブオブジェクトを解放し、アクティブオブジェクトのローカル変数を解放することです。これがローカル変数のライフサイクルの終わりです。
ここに画像の説明を挿入

第三に、スコープチェーン

関数のスコープチェーンは、複数レベルのスコープの連続参照によって形成されるチェーンテスト効果です。つまり、アクティブオブジェクトの親属性は、親スコープに対する関数のスコープ属性を参照します。スコープチェーンは親スコープを参照します。

スコープチェーン
  1. 各関数は、それが定義されているときに、その親関数のスコープチェーンをコピーします(関数宣言/関数式)
  2. 関数呼び出し中(実行中)にAOを生成してから、スコープチェーンのスタックの最上位にAOをプッシュします。
    ここに画像の説明を挿入
公開された40元の記事 ウォン称賛31 ビュー2787

おすすめ

転載: blog.csdn.net/CodingmanNAN/article/details/103015746