1

これは基本的な質問ですが、コンテキスト (「this」ポインター) が 2 番目のイベント ハンドラーでは正しく、最初のイベント ハンドラーでは正しくない理由がわかりません。

オブジェクト myNotifier を作成するためのこの単純なコンストラクター関数があります。

function Notifier ( message ) {
  this.message = message;
  this.saySomething = function () {
    alert( "I say:" + this.message);
  }
}

myNotifier = new Notifier(" HELLO!");

次に、このmyNotifier.saySomething()メソッドを 2 つのボタンの CLICK のイベント ハンドラーとして使用します。

$(".button1").click( myNotifier.saySomething );
$(".button2").click( function () { myNotifier.saySomething()});

1 つ目は、「I say: undefined」を示しています。2 つ目は、「I say: HELLO」を示しています。

メソッドを呼び出すときにコンテキスト (this) が元のオブジェクトではないことは理解していますが、2 番目のボタンの関数内で呼び出すときに正しいのはなぜですか?

テストするjsfiddle

4

2 に答える 2

3

キーワードに関する MDN のリファレンスをご覧くださいthis:はい、コンテキストはメソッドの呼び出し方法によって異なります。

関数をオブジェクトのプロパティとして呼び出すと (button2 のハンドラーのように)、そのオブジェクトがコンテキストとして使用されます。

ただし、イベント ハンドラーとして使用する場合 (jQuery でラップされている場合も同じです)、関数を呼び出すコンテキストは、リスナーがバインドされている現在の DOM 要素です。ボタンにはプロパティ「メッセージ」がないため、アラートが表示されますundefined。

もちろん、これらが唯一の選択肢ではありません。あなたは試すかもしれません

var fn = myNotifier.saySomething;
fn(); // context is the global object (window)

また

myNotifier.saySomething.call({message:"buh!"});

:-) - 説明などについては MDN を参照してください。

于 2012-09-22T17:41:03.313 に答える
1

キーワードは$(".button1").click、thisクラスを持つ Dom 要素button1です。

キーワードは、呼び出しをラップした無名関数を参照し$(".button2")ますthismyNotifier.saySomething()

apply()プロトタイプ関数を使用して、関数のコンテキストを変更できます。

于 2012-09-22T17:41:28.377 に答える