Javascript,jatwoli(this,scope,closure)

3212 ワード

1. scope

  • 変数アクセス可能範囲
  • 01.グローバルスキャン

  • は、名前の通りグローバル宣言であり、変数
  • にどこからでもアクセスできることを意味します.

    02.エリアスキャン

  • はこの地域からしか近づくことができず、外地から
  • に近づくことができない.

    03.関数スキャン(function-scoped)

  • JavaScriptで関数を宣言すると、関数を宣言するたびに新しいスキャンが作成されます.したがって、関数体に宣言する変数は、関数体のみにアクセスされ、関数体は領域体
  • である.

    04.ブロックスキャン(ブロック作用領域)

  • ブロック(block)は、括弧で囲まれた部分宣言ブロックであり、関数を宣言する際に関数本文を括弧で囲まれ、この部分はブロック
  • である.
  • の既存varでは、関数スキャンがあるため、関数内にのみ領域変数を保持する問題がある.ES 2015(ES 6)にはlet/constキーワードが追加され、非関数の通常ブロックで領域変数を宣言できるようになっている.
  • 05.LexicalScope(LexicalScope)

  • JavaScriptはLexicalScope(またはStatic Scope)に従います.LexicalScopeとは、関数がどこで宣言されているかに基づいて親スキャンを決定することです.重要な点は、関数の呼び出しではなく、関数の宣言に依存することです.
    var number = 1;
    function a() {
      var number = 10;
      b();
    }
    function b() {
      console.log(number);
    }
    a(); // ?
    b(); // ?
    
    ? 10 // a() 결과 X
    ? 1 // b() 결과 X
    
    1 // a() 결과
    1 // b() 결과
    呼び出し
  • 関数に基づいて決定される親スキャンは、動的スキャンとも呼ばれる.Perl,Bash Shellなどから動的Scopeに従う.
  • 2. this

  • thisは基本的にトップクラスのオブジェクトwindowを指しますが、文法によってはthisの指すものが異なります
  • 関数をオブジェクトとして呼び出すメソッドの場合、この値はオブジェクト
  • を使用します.
  • ES 2015は、このバインディングを提供しない矢印関数
  • を追加した.
  • 関数キーは、オブジェクトをバインドすることによってこの値
  • を変更します.
  • newキーワードでオブジェクトを作成すると、オブジェクトにバインドされ、そのオブジェクトの値が読み出されます.es 6に追加されたclassを使用すると、オブジェクトの動作が同じになります.

    01.実行コンテキスト

  • 抽象概念
  • JavaScriptコードの実行と計算の範囲を表す

    02. Global Execution Context

  • は、デフォルトではコードが実行する領域であり、グローバルオブジェクトWindowオブジェクトを作成し、グローバルオブジェクト(Windowオブジェクト)
  • に設定する.

    03. Functional Execution Context

  • 各関数には実行コンテキストがあり、関数を呼び出すときにその実行コンテキスト
  • が作成される.

    04. apply(), call(), bind() ?

  • 自由に我慢できる方法
  • const Tom = {
      age: 25,
      gender: 'man',
    };
    
    function printProfile(name) {
      console.log(name, this.age, this.gender);
    }
    
    printProfile.apply(Tom, ['Tom']); // Tom 25 man
    printProfile.call(Tom, 'Tom'); // Tom 25 man
    printProfile.bind(Tom, 'Tom').call(); // Tom 25 man

  • apply:call関数と似ていますが、パラメータは配列受信に違いがあります.

  • call:オブジェクトをバインドしながら呼び出されます.

  • bind:バインドされた関数を返し、再呼び出し時に実行します.

  • Execution contextを作成するとバインドされるためです.

  • バインドは、オブジェクトと関数の組合せです.
  • 3.キャビネット(クローズ)

  • ある関数Aを参照して宣言する変数bの内部関数Cが外部に伝達される場合、
  • .
  • Aの実行コンテキストが終了すると、変数bは
  • のままである.
  • 外部関数の変数の内部関数またはこの動作原理にアクセスできます.
  • 関数と宣言された関数の語彙環境の組合せ
  • エンクロージャ関数とその宣言時の語彙環境との相互関係から生じる現象
  • .
  • 関数は、独自の関数を含むコンテキスト
  • にアクセスすることができる.
  • 関数は、特定のスケールにアクセスできるように、そのスケールで意図的に定義される.
  • 関数を宣言するときに作成された有効範囲が消失した後も呼び出すことができる関数
  • .
  • 関数は、ライフサイクル終了後の外部関数の変数
  • を参照する.
  • の自由変数を有する関数と既知の自由変数の環境との結合
  • function outerFn() {
    let outerVar = 'outer';
    console.log(outerVar);
    
    function innerFn() {
    let innerVar = 'inner';
    console.log(innerVar);
    }
    return innerFn;
    }
    
    let globalVar = 'global';
    let innerFn = outerFn();
    innerFn();

  • Closer関数では、領域変数、外部関数の変数、およびグローバル変数にアクセスできます.

  • エンクロージャ使用例
  • コールバック関数で外部データを使用する必要がある場合、
  • .
  • アクセス制御(非表示情報)
  • 部分応用関数
  • カードループ関数