ホームページ >ウェブフロントエンド >フロントエンドQ&A >JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説)

JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説)

WBOY
WBOY転載
2022-01-19 17:53:562097ブラウズ

この記事では、JavaScript のスコープ チェーンについての知識を提供します。外部空間は内部変数にアクセスできません。多くの場合、この基本ルールしか知りません。では、この基本ルールを実装するための基本的な原理は何でしょうか?少しでもお役に立てれば幸いです。

JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説)

#スコープ

1. スコープとは

スコープ (英語:scope) とは、簡単に言うと、名前に基づいて変数を見つけるための一連の規則です。スコープは一般に閉じられた空間として理解できます。この空間は閉じられており、ありません。外部空間は内部空間にアクセスできないが、内部空間はそれを包む外部空間にアクセスできる。

2.[[スコープ]]属性

JavaScript では、各関数はオブジェクトであり、オブジェクトにはいくつかのプロパティがあります。アクセスできますが、一部は自由にアクセスできません。[[Scopes]] 属性もその 1 つです。この属性は JavaScript エンジンによってのみ読み取ることができます。

実際、[[scope]] は、スコープ ランタイムのコンテキスト コレクションを格納する、スコープとよく呼ばれるものです。

ここでは、func.prototype.constructor と func が同じ関数を指しているため、関数 func のプロトタイプ オブジェクトにアクセスして [[Scopes]] 属性を表示します

JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説)

3. スコープ チェーン

#[[スコープ]] に格納される実行時コンテキスト オブジェクトのコレクション。このコレクションは、チェーン 、このチェーン接続をスコープ チェーンと呼びます。 JavaScript はスコープ チェーンを通じて変数を検索します。検索方法は、スコープ チェーンの先頭に沿って下方向にクエリを実行することです (オブジェクトがどの関数内で見つかるかは、関数スコープ チェーン内で検索されます)

4. 変数の検索原理の図 #

//以如下代码为例说明JavaScript通过作用域链查找变量的原理**
function a() {
  function b() {
      var b = 123;
  }
  var a = 123;
  b();
}
var glob = 100;

1. グローバル関数 a() が定義されている場合、スコープ チェーンは次のようになります。

JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説) 関数の [[Scopes]] 属性は、スコープ チェーン オブジェクトを指します。現時点では、スコープ チェーンにはキーが 1 つだけあります。値のペアであり、このキーと値のペアがグローバル オブジェクトを指している場合、グローバル オブジェクトにはグローバルにアクセスできるもの、つまり誰もがアクセスできる最も外側のスコープが格納されます。

2. グローバル関数 a() がアクティブ化されて呼び出されるとき、スコープ チェーンは次のようになります。

JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説) この時点で、スコープ チェーンが最初にアクセスできるのは、アクティベーション オブジェクトのキーと値のペアです。そうでない場合は、グローバル オブジェクトがアクセスされます

3。関数 b が関数 a() で定義されている場合、 b のスコープ チェーンは次のとおりです。

JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説)b が定義されているだけで呼び出されない場合、 b のスコープ チェーンは a

4 と同じです。関数 a() 内の関数 b が起動されて呼び出される場合、スコープ チェーンは次のようになります

JavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説)

スコープ チェーンは、最初に関数 b() の Activation オブジェクトを指します。検索変数もスコープ チェーンの順序でアクセスされます。見つかったら停止します。

5. 概要

外部スコープが内部スコープにアクセスできない理由は、外部スコープのスコープ チェーンに内部スコープのアクティベーション オブジェクトがないためです。スコープにあるため、内部変数にアクセスできません。内部スコープ内の変数にアクセスする順序はスコープに従います。チェーン、最初に内側から検索し、そうでない場合はスコープチェーンに沿って外側を見て、外側がグローバルスコープ

関連する推奨事項:

JavaScript 学習チュートリアル

以上がJavaScriptの基本原理であるスコープチェーン(画像と文章で詳しく解説)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はjuejin.imで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。