瞭解何時以及如何使用Require.JS

Question

我剛剛開始使用Require.JS，我對使用它的適當情況以及使用它的正確方法有點不清楚在這些情況下。

以下是我如何使用Require.JS設置的東西。我有兩個功能，functionA()和functionB()。這兩個功能都需要額外的功能，functionC()才能正常工作。

我只想在必要時加載functionC（），即當函數functionA（）或functionB（）將被調用時。所以，我有以下文件：

functionC.js

functionC(){ 
    //do stuff 
} 

functionA.js

functionA(){ 
    define(['functionC'],function(){ 
    //functionC() is loaded because it is listed as a dependency, so we can proceed 
    //do some functionA() stuff 
    }); 
} 

functionB.js

functionB(){ 
    define(['functionC'],function(){ 
    //functionC() is loaded because it is listed as a dependency, so we can proceed 
    //do some functionB() stuff 
    }); 
} 

那麼，這個設置是否正確？如果我最終在同一個頁面上調用了functionA（）和functionB（），是否還需要額外的工作，因爲它們都加載了functionC.js文件？如果是這樣，那是一個問題嗎？如果是這樣，是否有辦法設置它，以便他們首先檢查是否已經加載了functionC.js，並且只在它沒有加載時加載它？最後，這是對Require.JS的適當使用嗎？

Answer 1

define()應該只用於定義一個模塊。對於上面的例子，其中的一段代碼應當動態加載，使用require()是比較合適的：

functionA.js

functionA(){ 
    require(['functionC'],function(functionC){ 
    //use funcC in here to call functionC 
    }); 
} 

一些注意事項：

• require([])是異步的，因此如果functionA的調用者期望從該功能返回值，則可能會出現錯誤。最好是functionA接受在functionA完成其工作時調用的回叫。
• 對於functionA的每個調用，上述代碼將調用require();但是，在第一次通話後，加載functionC.js不會受到任何懲罰，它只會加載一次。第一次調用require()時，它會加載functionC.js，但其餘時間RequireJS知道它已經加載，所以它會在不請求functionC.js的情況下調用function(functionC){}函數。

Answer 2

您可以找到有關RequireJS和JavaScript模塊化這裏的細節：JavaScript modularity with RequireJS (from spaghetti code to ravioli code)