これとバインド(本)(新しいES5)

この与バインド(この)

この

これは、スコープ(オブジェクトインスタンス)この関数は、以下の実施例を指し

CONSTアプリ= { 
    名: '暁' 
    ログ(){ 
      にconsole.log(この.nameの)。
    }、
    子供(){ 
      リターン{ 
        名: 'B' 
        ログ(){ 
          にconsole.log(この.nameの)。
        }、
      }。
    }、
  }。
  app.log(); // 暁明の 
  app.child()(ログ)。// B

この詳細

- 地球環境

厳密モードかどうかをグローバルオブジェクトに(その任意の機能外に)、この点をグローバル実行環境(「厳密な使用」)。

console.log(この ===ウィンドウ)。// 

この .nameの= '反応します' ; 
console.log(名); // 反応 
にconsole.log(window.nameを)// 反応

- 関数内

関数内、この値は、関数が呼び出された方法によって異なります。

1.通常の関数

グローバルオブジェクトへの非strictモード、このデフォルト設定。

関数F(){
   戻り 、これを
} 

// ブラウワーの 
F()=== ウィンドウ。
// ノード 
F()===グローバル。

strictモードでは、このデフォルトのオブジェクトのインスタンスは、呼び出し元の関数を指します。

関数F(){
  「厳密使用」
   戻す これを
} 
F() ===未定義。
ここで、F()を直接ではなく、例えばwindow.fなどのオブジェクトのプロパティまたはメソッドを呼び出し、(と呼ばれる)ため、ここでこれは未定義であるように。

この値は、1つの環境から普及するためには、メソッドは、呼び出しを適用したりする必要がある場合

VAR OBJ = {A:「カスタム」}; 

// このプロパティはグローバルオブジェクトで定義されています。
VaRの A = '参加無料' ; 

関数whatsThis(Argが){
   戻り 、この II.Aを;   // この値の関数によって呼び出されるが依存
} 

whatsThis();           // '参加無料' 
whatsThis.call(OBJ);   // 「カスタム' 
whatsThis.apply(OBJ); // 'カスタム」

JavaScript関数の定義は関数から継承されている、我々は、通話中Function.prototypeプロパティを呼び出すことにより、特定のオブジェクトにこの値をバインドしたりする方法を適用することができます。

機能の追加を(C、D){
   戻り 、この II.A + この .B + C + Dを; 
} 

VARの O = {:. 3 :. 1、B }; 

//は、最初のパラメータをオブジェクトは'この'として使用されています
/ / 関数呼び出しの引数として渡される後続のパラメータ 
add.call(O ,. 5 ,. 7); // 。1. 5 + + + 3 = 16 7 
// 最初のパラメータは'この'のオブジェクトとして使用される
// 第二パラメータは、関数呼び出しパラメータ素子アレイとして配列され 
add.apply(O、[10、20である]); // 1 + 10 + 20 = 3で+ 34れます。

コールを使用し、これに渡された値がオブジェクトでない場合は、注意を払うために時間の関数を適用し、JavaScriptはオブジェクトに変換するToObject内部動作を使用しようとします。このようなプリミティブ値または7「FOO」などの値は、その後、相関がコンストラクタオブジェクトに変換するために使用される場合したがって、7の元の値は、新しい番号(7)このように、文字のように、オブジェクトに変換されます。文字列「FOO」は、例えば、このように新たな文字列(「FOO」)に変換されます。

関数バー(){ 
  にconsole.log(Object.prototype.toString.call()); 
} 

// 元の値7は、オブジェクトに暗黙的に変換され 
bar.call(7); // [番号オブジェクト]

2.機能が矢印します

矢印ポインタ機能は、これを所有していません。方法は、関数呼び出し()または(適用)によって呼び出されたときのみ送信パラメータ(これに結合しません)。この関数は、グローバルオブジェクトを矢印に設定され、グローバルコード、閉鎖字句環境では、この機能と正常な機能これは矢印一致します。

VAR OBJ = { 
  バー:関数(){
     VAR X =(()=> );
     戻りX; 
  } 
} 
// この結合がobjのあるようにオブジェクトobjに、)バー(コールする
のvarのFn = OBJ。バー(); 
はconsole.log(FN() === OBJ); // trueに

// ここでは、バー()が、割り当て参照バーFN2の呼び出しません
VAR Fn2が= obj.bar;
 // 呼び出すためにグローバル変数をバー()、このここに結合グローバルよう 
にconsole.log(FN2()()==がウィンドウ)。

3.オブジェクトの機能

機能を対象において呼び出されたときに、この点は、関数を呼び出すことを目的とします。

CONSTアプリ= { 
  名: 'xiaohong' 
  F:関数(){ 
    にconsole.log(この.nameの)。
  } 
}

これはアプリケーションオブジェクトを指すF()関数。

これは、最も近い参照の唯一の冒されたメンバーを結合します。例えば:

VaRの O = {プロパ:37 }。

関数依存性(){
   戻り 、この.propと、
} 
 = 独立。

console.log()(の)。// ログ37 

OB = {G:独立した、プロペラ:42 }。
console.log(OBG())。// 42

これは、彼とはほとんど関係を持っている、最も近い参照が最も重要であるオブジェクトoのメンバーであることが判明しました。

このプロトタイプチェーン

メソッドは、オブジェクトのプロトタイプチェーン内に存在する場合、この点は、オブジェクトの場合と同じ方法として、オブジェクトこのメソッドを呼び出すことです。

VaRの O = { 
  F:関数(){ 
     戻り 、この .A + この.Bと、
  } 
}。
VARの P = Object.create(O)
PA = 1 
PB = 4 

console.log(PF())。// 5

この場合、オブジェクトp fはプロパティがそのプロトタイプから継承されたfが、それはだ、独自のプロパティに属していません。Fに発見プロセスは、最終的にはF 0のプロパティを見つけることであるが、これは問題ではない。最初PF最初参照ので、この点Pの関数から発見プロセスを。これは、メソッド呼び出しとしてF pをするので、あるので、pはこの時点です。

このゲッターとセッターに
ゲッターやセッター関数として設定するか、プロパティを取得するためにバインドされ、このオブジェクトを配置します。

バインド(これ)
ES5はFunction.prototype.bindを紹介します。(SomeObjectのを)f.bind呼び出し、関数fは、体の同じ範囲と機能を持って作成しますが、この新機能では、これは恒久的に機能があることをあるどんなに、最初のパラメータをバインドするためにバインドされます呼び出します。結合パラメータは一度だけ有効になりますバインド

関数F(){
   戻り 、このII.Aを; 
} 

VARの G = f.bind({A: "AZERTY" }); 
はconsole.log(G()); // AZERTYの

VARの H = g.bind({ 'ユ「}); // バインドは一度だけ有効になります!
console.log(H()); // AZERTY

着信設定パラメータバインド機能の順序に従って、第二のパラメータを結合し、以下の。

VaRの FOO = { 
    X: 3 
} 
VARのバー= 関数(){ 
    にconsole.log(この.X)。
} 
バー()。// 未定義

VAR boundFunc = bar.bind(FOO); 

boundFunc(); // 3

時には、我々はつまり、ランタイム環境で、あなたはこの値にアクセスしたい、コンテキストでこれを維持する必要があります。どの時点でそれをしなければなりませんか?

のは、グローバル変数にオブジェクトを割り当てる方法を言ってみましょう、その後、グローバル変数で、このアプローチを呼んで、この値は、もはや元のオブジェクトが、ウィンドウオブジェクトではありません。しかし、我々はまた、オブジェクトのメソッドに基づいて呼び出す必要があります。

別の例は、この方法では、独自の方法で、内部検索機能のみこれらの2つの変数を呼び出すときに、このテーマが自動的に生成されるので、クロージャは、このターゲットの外部関数にアクセスすることはできません、閉鎖を含み独自の活動へのオブジェクトを検索します。閉鎖この値外の機能にアクセスできないように、鎖に沿った範囲を検索せず。

反応では、頻繁に参照

輸出デフォルトクラスのAppは、コンポーネント{拡張
  コンストラクタ(小道具){ 
    スーパー(小道具)。
    この .fooという= この .foo.bind(
  } 
  
  FOOを(){ 
    // TODO何か
  } 
  
  レンダリング(){ 
    リターン <表示> 
        <ボタンたonPress = { この .fooという()} /> 
      </ビュー> 
  } 
}

あなたは変数に関数名を渡すと、このメソッドを呼び出すために「)(」変数の後のカッコは、内部の点のこの方法は失われます。内部でこの時点の外になりますfooメソッドは失われます。

イベントハンドラが渡されたかに関係なく、それはこのポイントのように、この問題を解決するために、我々は一度にオブジェクトをインスタンス化する必要があり、我々は、コンストラクタでこれをバインドする必要があり、我々は、オブジェクトをインスタンス化され、固定小数点を固定されています。

オリジナルリンクします。https://blog.csdn.net/u013003052/article/details/87894194

おすすめ

転載: www.cnblogs.com/yangwenbo/p/11447333.html