2

環境

jQuery を使用する場合this、変数を保持する必要があることがよくあります。

var obj = {
    myVar: null,
    myFunction1: function() { ... },
    myFunction2: function() {
        this.myVar = "blabla";
        this.myFunction1();

        var ctx = this;
        $('xxx').click(function () {
            ctx.myFunction1();
        });
    }
}

この場合、すべてthisを自分の変数に置き換えます。

var obj = {
    myVar: null,
    myFunction1: function() { ... },
    myFunction2: function() {
        var ctx = this;

        ctx.myVar = "blabla";
        ctx.myFunction1();

        $('xxx').click(function () {
            ctx.myFunction1();
        });

        //etc. I do it for all "this" even if I have 15 "this"...
    }
}

質問

  • this変数を保持することは良い習慣ですか? 別の方法はありますか？
  • thisすべてを変数に置き換えるのは良い習慣ですか?
4

5 に答える 5

3

this異なる機能で異なります。その状況では文脈が異なります。

したがって、別の変数に保持するのが賢明です。そうすれば、話しているコンテキストを確実に知ることができます。

サブ関数がある関数内ではこれをお勧めしますが、通常の関数ではそうではありません。そこには必要ありません。

注：それを置き換えるのではなく、正しいコンテキストへのポインタを持っているだけです。

于 2012-09-03T15:22:24.010 に答える
2

別の方法はありますか？

はい: 匿名の自己実行関数を使用してスコープへの参照を渡すことができます

myFunction2: function() {
    this.myVar = "blabla";
    this.myFunction1();

    (function(outerscope) {
        $('xxx').click(function () {
            outerscope.myFunction1();
        });
    }(this));
 }

とにかく、あなたが行ったように参照を保存することは問題ありません（または、少なくとも、google javascript style guideの悪い習慣として推奨されていません）。これは広く使用されている一般的な方法です。

于 2012-09-03T15:22:56.917 に答える
2

別の方法はありますか？

$.proxy [docs]を使用できます：

$('xxx').click($.proxy(function () {
    this.myFunction1();
}, this));

これは明らかにイベント ハンドラー内で上書きthisされるため、 を介して要素にアクセスすることはできませんthis。

イベントデータthisとして渡すこともできます[docs] :

$('xxx').click({ctx: this}, function (event) {
    event.data.ctx.myFunction1();
});

最も読みやすいと思うことは何でもしてください。私は個人的に、ネストされた関数内やその他の場所で割り当てvar self = this;て使用するだけです。selfthis

于 2012-09-03T15:25:36.603 に答える
1

これは一般的に受け入れられているパターンですが、関数内に関数があると混乱する可能性があります (関数関数内 ;-) など

これを軽減する 1 つの方法 (および一般的な代替アプローチ) は、関数を特定のコンテキスト オブジェクトにバインドすることです。ECMAScript 5 の bind() 関数はこれを処理しますが、Web 環境で使用するにはまだ安全ではありません。

今のところ、代わりにjQuery のプロキシ関数を使用できます。

    $('xxx').click(jQuery.proxy(function () {
        this.myFunction1();
    }, this));
于 2012-09-03T15:29:34.283 に答える
1

私は常に作成するために使用します：

var _self = this;

正直なところ、それがベスト プラクティスかどうかはわかりませんが、私は js でコーディングしているので、多くの人がそれを行っているのを見て、快適に使用できると感じています。

于 2012-09-03T15:23:29.817 に答える