子コンテキストで親コンテキストにアクセスするいくつかの方法を次に示します - H2>

1. を使用して a>() 関数をバインドできます。
2. context/this への参照を別の変数に保存します (以下の例を参照)。
3. ES6 arrow 機能を使用します。
4. コード、機能設計、アーキテクチャを変更する - そのためには、JavaScript の デザイン パターン a> をマスターする必要があります。

1.bind()関数

Underscore.js を使用している場合 - http://underscorejs.org/#bind

2. context/this への参照を別の変数に保存します

3.アロー関数

概要これについて知っておくべきこと

this (別名「コンテキスト」) は、各関数内の特別なキーワードであり、その値は、関数が呼び出される方法/いつ/何をどこで呼び出すかではなく、関数が呼び出される方法にのみ依存します。それは定義されています。他の変数と同様に字句スコープの影響を受けません (アロー関数を除く、以下を参照)。ここではいくつかの例を示します：＃＃＃ リーリー この

MDN ドキュメント をご覧ください。 正しい引用方法

アロー関数を使用する

ECMAScript 6 では、ラムダ関数と考えることができる arrow 関数 が導入されています。独自の

バインディングはありません。代わりに、this は通常の変数と同じようにスコープ内で検索されます。これは、.bind を呼び出す必要がないことを意味します。これは特別な動作だけではありません。詳細については、MDN ドキュメントを参照してください。 リーリー これは使用しないでください

this に具体的にアクセスする必要はありませんが、 それが参照するオブジェクト

self と that です。 リーリー self は通常の変数であるため、字句スコープ規則に従い、コールバック内でアクセスできます。これには、コールバック自体の this

コールバックの明示的な設定 this - パート 1

this の値は自動的に設定されるため、値を制御できないように見えるかもしれませんが、実際はそうではありません。

.bind

[docs] があり、this ^{の新しい関数を返します。値にバインドします。この関数は、}this がユーザーによって設定されることを除いて、呼び出した関数 .bind とまったく同じ動作をします。関数がいつどのように呼び出されるかに関係なく、this は常に渡された値を参照します。 リーリー この例では、コールバックの this を MyConstructor

this の値にバインドします。 注: jQuery のコンテキストをバインドするときは、

[docs] replace を使用します。 。この理由は、イベント コールバックのバインドを解除するときに関数への参照を保存する必要がないためです。 jQuery はこれを内部で処理します。 ^{コールバックの設定} this - パート 2

this が参照する必要がある値も受け入れます。これは基本的に自分でバインドするのと同じですが、関数/メソッドが自動的にバインドします。

[docs]これがメソッドです。その署名は次のとおりです: リーリー ^{最初のパラメータはコールバックで、2 番目のパラメータは} this が参照する値です。以下は不自然な例です: リーリー

注: this に値を渡すことが可能かどうかは、通常、その関数/メソッドのドキュメントに記載されています。たとえば、jQuery の $.ajax メソッド ^[docs] には、context:

FAQ: オブジェクト メソッドをコールバック/イベント ハンドラーとして使用する

この問題のもう 1 つの一般的な症状は、オブジェクト メソッドがコールバック/イベント ハンドラーとして使用される場合です。関数は JavaScript の第一級市民であり、「メソッド」という用語は、オブジェクトのプロパティの値である関数を表す口語的な用語にすぎません。ただし、この関数には、その「含まれる」オブジェクトへの特定のリンクがありません。

次の例を考えてみましょう:

関数 this.method がクリック イベント ハンドラーとして指定されていますが、document.body がクリックされた場合、ログに記録される値は unknown になります。イベント ハンドラー this は、Foo のインスタンスではなく、document.body を参照します。
冒頭ですでに述べたように、this が何を指すかは、関数 の定義方法ではなく、関数 の呼び出し方法によって決まります。 コードが次のようになっている場合、関数にオブジェクトへの暗黙的な参照がないことがより明らかになるかもしれません。 リーリー
解決策

.bind を使用して、利用可能な場合は this を特定の値 に明示的にバインドします。 リーリー または、無名関数をコールバック/イベント ハンドラーとして使用し、オブジェクト (this

または、アロー関数を使用します: リーリー