爲什麼我們需要在Javascript中的類中使用「var self = this」？

Question

爲什麼我們不能在下面的例子中直接使用this而不是self？

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

後的反應，我已經學會：

是的，有沒有必要，如果有類沒有上下文切換。

但我會用這種方法作爲「約定」，雖然沒有必要。

Answer 1

有沒有理由，爲什麼你不能使用this直接出現（我會說這將是一個可讀性更好，如果你做）。

然而，var self = this;往往需要在類似的情況下（基本上，像事件的任何異步操作結合，AJAX等處理，其中this分辨率推遲直到它等於別的東西）;

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); 
} 

Answer 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');     
      } 
     }); 
    } 
}); 

Answer 3

在您的示例代碼沒有理由在所有this複製到一個變量。

它通常在代碼使用回調方法時使用。在回調方法this內部沒有引用該對象，因此您使用該變量。

Answer 4

通常這樣做是爲了在上下文發生變化時保持對此的引用。它經常用於事件處理程序或回調函數。但是如前所述，沒有理由在你的具體例子中使用它。

你會發現下面的文章中更多的細節：http://www.alistapart.com/articles/getoutbindingsituations