如何在我的情況下正確使用Javascript'this'？

我有以下（簡化）代碼：如何在我的情況下正確使用Javascript'this'？

var myModule = { 

    submitDummyForm: function(){ 
     console.log(this); // the right object is logged out 
     var that = this; // keep a reference 
     $.ajax({ 
      type:'POST', 
      url: 'http://localhost/', 
      data: {dummyData: 'something'}, 
      dataType: 'json', 
      success: that.dummyFormSuccess 

     }); 
    }, 

    dummyFormSuccess: function(data){ 
     console.log(this); // 'this' is logged out as some foreign object, most probably jQuery.ajax object 
    } 
}

它導致「這」丟失在dummyFormSuccess，不管我用this.dummyFormSuccess或that.dummyFormSuccessfor作爲參數爲我ajaxSubmitForm（）。

但正如我需要下面的代碼被執行：

var myModule = { 

    submitDummyForm: function(){ 
     console.log(this); // the right object is logged out 
     var that = this; // keep a reference 
     $.ajax({ 
      type:'POST', 
      url: 'http://localhost/', 
      data: {dummyData: 'something'}, 
      dataType: 'json', 
      success: function(data) { 
       that.dummyFormSuccess(data); 
      } 
     }); 
    }, 

    dummyFormSuccess: function(data){ 
     console.log(this); // now 'this' is logged out correctly as the real myModule object 
    } 
}

我仍然不是很舒服的JavaScript高級的話題，但我已經知道，「這」可能會被重新定義，這取決於它用來。我想如果我使用'that'來存儲對'this'的引用，它應該保留我的'this'在被調用的函數中。看起來很奇怪，我可以在一個環繞函數中調用that.dummyFormSuccess（data），它在裏面得到正確的'this'，但是如果我將它賦值給$ .ajax成功，我的'this'就會丟失。

任何人都可以解釋一下，'這個'在我的情況下迷失了嗎？爲什麼它在第二個例子中工作正常？這是與jQuery的問題（也許jQuery.ajax（）覆蓋我的'這'在我的情況）或只是語言的功能？

來源

2011-08-26 JustAMartin

一切都正確。您的this在第一個示例中丟失，因爲您是將函數that.dummyFormSuccess指定給jQuery ajax對象的success。所以，深入jQuery的這種方式，就像ajax.success。因此，this被ajax對象覆蓋。

第二種方法是創建一個匿名函數並將其分配到success。所以在你的匿名函數中，this指向ajax對象，但that變量是可訪問的並且沒有被覆蓋。

來源

2011-08-26 15:29:18 J0HN

你誤會了this。

this參數的值由調用網址 –決定，調用您的函數的代碼。
當您通過that.dummyFormSuccess或this.dummyFormSuccess時，您只是傳遞恰好來自對象的函數。
this或that對象僅用於檢索函數實例;它不與功能捆綁在一起。

當jQuery調用你的回調時，它總是在jqXHR對象的上下文中調用它。
當你通過function(data) { that.dummyFormSuccess(data); }時，你的函數表達式在這個jqXHR對象的上下文中被調用。
但是，您的回撥在that的上下文中調用dummyFormSuccess，因此其this就是您想要的值。

來源

2011-08-26 15:25:12 SLaks

由於函數也可以表示一個對象（它是一個對象），因此this意味着該函數。（不同範圍）

你需要做的是把var that = this;放在dummyForm : function之外（上面的那一行），然後做console.log(that)。

var that = this; 
dummyFormSuccess: function(data){ 
    console.log(that); // now 'this' is logged out correctly as the real myModule object 
}

來源

2011-08-26 15:25:36 Pwnna

錯誤。 '這個'並不意味着這個功能。 – SLaks

您可以在JavaScript中將'this'視爲函數參數列表中的附加參數。因此，函數的每個調用都將在this參數中包含自己的值。以下是JS調用

功能

foo();的所有三種方式 - 功能this內將被設置爲默認命名空間對象（窗口在瀏覽器環境的情況下）。（）中引用obj引用。
foo.call(obj); - '富' 將與this組被調用以obj（同上）

來源

2011-08-26 15:39:30

如何在我的情況下正確使用Javascript'this'？

回答

相關問題