18

次の例のthis代わりに直接使用できないのはなぜですか?self

function SeatReservation(name, initialMeal) {
    var self = this;
    self.name = name;
    self.meal = ko.observable(initialMeal);
}

回答後、次のことを学びました。

はい、クラスにコンテキスト スイッチがない場合は必要ありません。

しかし、必要はありませんが、このアプローチを「慣例」として使用します。

4

4 に答える 4

27

There's no reason why you can't use this directly there (and I would say it would be better for readability if you did).

However, the var self = this; is often needed in situations like the following (basically, any asynchronous action like event binding, AJAX handlers etc, where the resolution of this is deferred until it equals something else);

function SeatReservation(name, initialMeal) {
    var self = this;
    self.name = name;
    self.meal = ko.observable(initialMeal);

    setTimeout(function () {
        alert(self.name); // otherwise, this is window; use self to keep a reference to the "SeatReservation" instance.
    }, 100);
}
于 2012-07-20T10:12:15.513 に答える
8

これは通常、コンテキストが変化したときに this への参照を保持するために行われます。これは、イベント ハンドラーまたはコールバック関数でよく使用されます。ただし、前述のように、特定の例で使用する理由はありません。

詳細については、次の記事を参照してください: http://www.alistapart.com/articles/getoutbindingsituations

于 2012-07-20T10:14:47.947 に答える
5

thisあなたのコード例では、変数にコピーする理由はまったくありません。

通常、コードでコールバック メソッドを使用する場合に使用されます。コールバック メソッド内でthisはオブジェクトを参照しないため、そのために変数を使用します。

于 2012-07-20T10:14:41.737 に答える
2

あなたの例に基づいて、これを行う理由は「ありません」。

ただし、その使用法に眉をひそめる人もいるかもしれませんが、それが役立つ状況があります。

すなわち

$('a.go').click(function(e)
{
    e.preventDefault();
    if(!$(this).hasClass('busy'))
    {
        $(this).addClass('busy');
        $.ajax(
        {
            success : function(resp)
            {
                $(this).removeClass('busy');
            },
            error : function()
            {
                $(this).removeClass('busy');                
            }
        });
    }
});

上記では$(this)、スコープが失われているため、成功とエラーのコールバックはクリックしたリンクに反映されません。

これを回避するには、次のようにしますvar self = $(this)。

$('a.go').click(function(e)
{
    e.preventDefault();
    if(!$(this).hasClass('busy'))
    {
        $(this).addClass('busy');
        var btn = $(this);
        $.ajax(
        {
            success : function(resp)
            {
                btn.removeClass('busy');
            },
            error : function()
            {
                btn.removeClass('busy');                
            }
        });
    }
});
于 2012-07-20T10:14:09.000 に答える