1

次のコードがあります。

bindEvents: function() {
    $('#weight').click($.proxy(function(){
        this.changeWeight($('#weight').is(':checked'));
    },this));
    $('#produce').change($.proxy(function(){
        this.changeProduce();
    },this));
    $('.help-gtin').click($.proxy(function(){
        if ($('#help-gtin').is(':hidden')) {
            $('#help-gtin').slideDown();
        } else {
            $('#help-gtin').slideUp();
        }
        this.refreshGtin();
    },this);

    $('[name="order_production"]').click($.proxy(function(){
        this.changeProduction();
    },this));

},

内部のすべてのメソッドはスコープ内で呼び出す必要があるため、この繰り返しコード$.proxy 呼び出しを減らすにはどうすればよいですか?bindEventsthis

4

1 に答える 1

3

に等しい変数を設定し、それを使用して、それらがすでにクロージャであるという事実を利用します。this

bindEvents: function() {
    var self = this; // <==== Set the variable

    $('#weight').click(function(){
        // v--- Use it (throughout)
        self.changeWeight($('#weight').is(':checked'));
    });
    $('#produce').change(function(){
        self.changeProduce();
    });
    $('.help-gtin').click(function(){
        if ($('#help-gtin').is(':hidden')) {
            $('#help-gtin').slideDown();
        } else {
            $('#help-gtin').slideUp();
        }
        self.refreshGtin();
    });

    $('[name="order_production"]').click(function(){
        self.changeProduction();
    });

},

bindEventsの呼び出しのコンテキスト内で定義するすべての関数は、その呼び出しにbindEvents関連付けられたローカル変数にアクセスできます。とは異なりthis、これらの変数は関数の呼び出し方法に応じて変化しません。

これには、jQueryの意味を持つイベントハンドラー内で使用できるという利点もあります。これはthis、イベントをフックした要素です(これにより、たとえば、click上のハンドラー内でイベントを再度検索する手間が省けます#weight)。

于 2012-12-05T11:37:48.860 に答える