2013-04-01 37 views
4

隨着時間的推移,我創建了一堆各種JavaScript函數。他們大多數是靜態功能,並且可以修改出現的日期,從數組創建選擇菜單HTML等。組織我的JavaScript函數庫

我目前將它們全部放在名爲「general.js」的文件中把我的HTML頁面直接調用,和他們每個人看起來像:

function modifyDate(data){....} 
function makeArray(arr){....} 

然後我用它們爲:

alert(modifyDate("12/14/2013")); 

我想這是因爲它可能產生衝突的一個壞主意其他圖書館。相反,我想到的是類似以下內容:

myLibrary={}; 
myLibrary.modifyDate= function(data){....} 
myLibrary.makeArray= function(arr){....} 

而且他們使用它們爲:

alert(myLibrary.modifyDate("12/14/2013")); 

請注意,我有種使這個了,我去。請提供建議,我應該如何最好地組織我的JavaScript庫。謝謝

回答

8

你所描述的是叫做命名空間並且通常被認爲是一個好主意。 Why do they use namespaces in javascript?

一般命名空間的好處是:

  1. 限制全球範圍內的污染和防止命名衝突
  2. 提供上下文

    命名空間的一些更多的討論可以在這個問題上找到爲你的函數名稱(例如,我們期望WindowUtils.getHeightMenuUtils.getHeight的不同結果)。

因此,您的示例將提供第一個好處,但不一定是第二個好處,如果這只是一組抓包功能。無論這是一件好事還是完全依賴於您的個人項目以及您想要做的事情。

請注意,如果你要來命名空間,你可能想看看進入模塊模式這是保護您的命名空間的範圍,允許私有變量/保護狀態的一種方式。有一個在this answer to a similar question一個很好的例子,或者你可以看看這個canonical blog post on the module pattern

在你的情況下,模塊模式將是這個樣子:

var myLibrary=(function(){ 
    var privateVariable; //accessible by your functions but not in the global context  
    return { 
    modifyDate: function(data){....}, 
    myLibrarymakeArray: function(arr){....} 
    }; 
}()) 
+0

感謝本。任何建議如何實現命名空間?我剛剛搜索「如何實現JavaScript命名空間」,並遇到http://blog.arc90.com/2008/06/06/an-easy-way-to-implement-namespaces-in-javascript/。他們推薦使用eval(),這似乎總是一個壞主意。 – user1032531

+0

關於你的第二個好處,我想我可以使用'myGenericLibrary.mySpecificLibrary.myFunction()',對吧? – user1032531

+0

@ user1032531不需要使用eval。如果需要,你可以擁有雙重命名空間,儘管這會讓人很煩,很快就會打電話。你也可以把它分成2個命名空間,或者根本不用擔心上下文。無論是什麼使它可讀/容易理解你和其他人。就具體實現而言,請參閱我添加的模塊模式示例以及各種鏈接。 –