1

Javascript でプロトタイプの継承を使用しようとしています。以下の私のコードの問題は、ボタンがクリックされMyNamespace.MyObj.myEventHandlerて呼び出されたときに、 の値がthisのインスタンスでMyNamespace.MyObjはなく、クリックされたボタンであることです。

私は物事を間違って構造化していますか (より良い方法はありますか)? this呼び出し元のボタンではなく、オブジェクトのインスタンスであることをどうにかして確認できますか?

var MyNamespace.MyObj = function(myform) {
  this.myform = myform;
  jQuery('.mybutton', this.myform).click(this.myEventHandler);
};

MyNamespace.MyObj.prototype = {
  myEventHandler: function() {
    this.myform.get(0).submit();
  }
};

jQuery(document).ready(function() {
  new MyNamespace.MyObj(jQuery('#myform'));
});

これは、私がプロトタイプの継承を学ぶために使用している非常に単純な例です。上記のコードの実際の機能は jQuery で簡単に実行できること、またはオブジェクト リテラルまたはモジュール パターンを使用できることを認識していますが、現時点では特定の機能を実装するのではなく、プロトタイプの継承を学ぶことに本当に興味があります。 .

4

2 に答える 2

5

値を保持するにはさまざまな方法がありますがthis、最も単純な IMO は次のとおりです。

var MyNamespace.MyObj = function(myform) {
  var instance = this; // store `this`
  this.myform = myform;
  jQuery('.mybutton', this.myform).click(function () {
    instance.myEventHandler(); // use the stored value
  });
};
于 2010-07-22T15:10:17.300 に答える
0

es5Function.prototype.bindにアクセスできる*場合は、次のことができます。

jQuery('.mybutton', this.myform).click(this.myEventHandler.bind(this));

jQuery は を提供しますjQuery.proxy。これは同じことを行いますが、構文が異なります。

jQuery('.mybutton', this.myform).click(jQuery.proxy(this.myEventHandler, this));

これらはどちらもメソッドとオブジェクトで機能し、そのオブジェクトでそのメソッドを呼び出す関数を返します。

JavaScript でメソッドを渡す (または割り当てる) と、元のオブジェクトから切り離されます。これは、知っておくべきことの 1 つにすぎません。(これは、実際に継承を機能させるのと同じことです。メソッドは親から切り離され、子のコンテキストで呼び出されます。)

*たとえば、es5 shimを介して。

于 2011-04-05T02:24:47.473 に答える