使用對象方法作爲事件監聽器

我是一個剛剛學習JavaScript的C++人，所以'this'綁定到調用對象的事實仍然令人驚訝。我想使用一個對象方法作爲一個事件監聽器，並且想要確保我正在使用JavaScript專業人員的所有風格。使用對象方法作爲事件監聽器

因此，獲得方法有它的對象「這個」，這樣我就可以在適當的情況下訪問其屬性，我寫了下面的：

var user = 
{ 
    status: 1,  // login status: 0:invalid password, 1:logged out, 2:logged in 
loginName: "", 

// Method called whenever the user submits a username/password via html form: 
onLoginSubmit: function (event) 
{ 
     if (this != user) // called from 'form submit' callback, so call ourselves: 
    { 
     user.onLoginSubmit(event); 
     return; 
    } 
} 
};

我發現了一個以前的答案在這裏： Accessing an object's property from an event listener call in Javascript，但提出的解決方案是基本上創建一個全球。有沒有比以前的解決方案或我的遞歸解決方案更酷，更專業的方式來獲得'這個'？

來源

2011-08-31 Steger

我假設當你結合的提交處理程序，你正在做這樣的事情：

form.submit(user.onLoginSubmit);

儘管你有什麼不工作，做的最好的辦法是綁定提交處理程序，以便它實際上使用適當的'this'調用LoginLogSubmit，以便在提交處理程序中不需要任何額外的邏輯。

如果你在綁定函數時做了這樣的事情，那麼它應該工作。

form.submit(function(e) { 
    user.onLoginSubmit(e); 
});

通過使用匿名函數，仍然可以正確調用用戶對象的方法。

如果我誤解了你的問題，請發佈一些關於你如何調用LoginSubmit（）的代碼。

來源

2011-08-31 23:54:19 loganfsmyth

關於js的一個重要的事情是這樣的閉包。和匿名函數。哦，我提到了關閉嗎？這些非常重要。 – Alxandr

這就是我一直在尋找的！而且要知道我沒有做過什麼愚蠢的事情......匿名函數技術將我的類方法中的怪異移到了它所屬的位置。謝謝。 – Steger

你可以使用封，這應該工作：

function User() { 

    var that = this; 
    this.status = 1; 
    this.loginName = ""; 
    this.onLoginSubmit = function (event) 
    { 
    // the variable "that" is available and references the User instance 
    } 
} 
var user = new User();

這裏我們使用用戶作爲構造，因此這指向的對象被通過的「新」建設。會發生什麼（粗略）是「this」變量對於User函數是本地的，但是由於函數引用它，它會保留在內存中並且可用於此函數。然後，您可以使用「that」而不是「this」作爲「假」範圍。

如果你有很多User實例，這不是你想要使用的，因爲這些函數是爲每個實例創建的。「常規」的方式是使用Logan答案中的匿名函數。大多數（如果不是全部的話）框架有很好的方法來處理這個問題，但基本上你需要通過閉包來獲得函數本身的可用範圍，或者在調用函數時知道它，所以你可以用正確的範圍（通過寫user.onLoginSubmit（））

希望這還挺清楚:)

編輯：哦有人張貼那種同樣的事情在你鏈接的帖子。那麼現在你有它爲'用戶'量身定做！

來源

2011-09-01 00:22:52 Jad

感謝您的回覆。我現在看到'那'不是全球性的 - 它有功能範圍。我只有一個用戶對象，但如果我有多個用戶對象，那麼仍然只有一個'那個'，對嗎？ – Steger

因爲'that'是本地的，所以每個User實例都有它自己的副本（以及它自己的onLoginSubmit方法） – Jad

使用對象方法作爲事件監聽器

回答

相關問題