在函數陣列中引用另一個函數

Question

我正在使用require.js並在多個地方使用函數庫。我正是如此定義功能：

define(function (require) { 

    "use strict"; 

    var $ = require('jquery'); 

    var UsefulFuncs = {}; 

    UsefulFuncs.hideAlert = function() { 
     $('.alert').hide(); 
    }; 


    UsefulFuncs.loadURL = function (url){ 
      navigator.app.loadUrl(url, { openExternal:true }); 
      return false; 
    }; 


    UsefulFuncs.linkClicked = function (e) {  
     e.preventDefault(); 
     var url = $(e.currentTarget).attr("rel"); 
     this.loadURL(url); 
    }; 


    return UsefulFuncs; 

}); 

然後，在我的骨幹視圖，我調用函數從庫：

UsefulFuncs   = require('app/utils/useful_func'), 

.... 

UsefulFuncs.linkClicked 

這工作得很好任何獨立功能庫例如hideAlert（）。然而，當庫中的一個功能是指另一種，如linkClicked（）調用使用loadURL（），我得到一個錯誤：

Uncaught TypeError: Object [object Object] has no method 'loadURL'. 

任何想法如何，我可以參考使用loadURL（）？

Answer 1

我會假設你設置UsefulFuncs.linkClicked作爲一個事件的處理程序。

如果你使用這樣的：

UsefulFuncs.linkClicked() 

，this裏面的功能將參考UsefulFuncs，所以this.loadURL()將是有效的。

但是，由於您將其設置爲事件的處理程序，因此可以通過其他方式調用它，並將this設置爲某個其他對象（可能是觸發該事件的元素）。爲了避免事件處理機制改變你this，可以綁定的功能，當你給它分配：

element.onclick = UsefulFuncs.linkClicked.bind(UsefulFuncs); 

另一種方式去解決它，以避免在處理程序使用this，就像這樣：

UsefulFuncs.linkClicked = function (e) {  
    e.preventDefault(); 
    var url = $(e.currentTarget).attr("rel"); 
    UsefulFuncs.loadURL(url); 
}; 

這創建了一個關閉UsefulFuncs（第一種方法也行，但它更標準化）。

Answer 2

嘗試這樣：

define(function (require) { 

    "use strict"; 

    var $ = require('jquery'); 

    var hideAlert = function() { 
     $('.alert').hide(); 
    }; 


    var loadURL = function (url){ 
      navigator.app.loadUrl(url, { openExternal:true }); 
      return false; 
    }; 


    var linkClicked = function (e) {  
     e.preventDefault(); 
     var url = $(e.currentTarget).attr("rel"); 
     loadURL(url); 
    }; 


    return { 
     hideAlert : hideAlert, 
     loadURL : loadURL, 
     linkClicked : linkClicked 
    }; 

});