JavaScript 沒有內建的模組支援,但社群已經創造出令人印象深刻的解決方法。若要管理模組,您可以使用所謂的套件管理員,它處理發現、安裝、相依性管理等。
JavaScript 模組最重要的兩個(而且不幸地不相容)標準是:
此標準的主要化身是Node.js 模組(Node.js 模組有幾個超越 CJS 的功能)。其特性包括
eval()
或靜態編譯步驟的情況下運作
在套件管理員方面,npm(Node 封裝模組)是 Node.js 的標準選擇。對於瀏覽器,有兩個選項很受歡迎(還有其他選項):
對於一般的 Web開發,您應該使用模組系統,例如 RequireJS 或 Browserify。但是,有時您只想快速組裝一個 hack。這時,下列簡單的模組模式可以提供協助:
var
moduleName
=
function
()
{
function
privateFunction
()
{
...
}
function
publicFunction
(...)
{
privateFunction
();
otherModule
.
doSomething
();
// implicit import
}
return
{
// exports
publicFunction
:
publicFunction
};
}();
前述是一個儲存在全域變數 moduleName
中的模組。它執行下列動作
otherModule
)
privateFunction
publicFunction
若要在網頁上使用模組,只需透過 <script>
標籤載入其檔案及其相依性的檔案
<script
src=
"modules/otherModule.js"
></script>
<script
src=
"modules/moduleName.js"
></script>
<script
type=
"text/javascript"
>
moduleName
.
publicFunction
(...);
</script>
如果在載入模組時未存取其他模組(moduleName
的情況即為如此),則載入模組的順序並不重要。
以下是我的評論和建議