筆記一下在 import export 尚未普及的年代,如何撰寫自己的 JavaScript 的模組。這類的模組化寫法,是當你要讓你的模組得以使用 cdn 引入時所必須的。
Demo
解說
1 2 3 4 5 6 7 8 9 10 11 |
(function DemoModule(demoModule, window) { let _temp = "string1"; demoModule.getTemp = function () { return _temp; }; demoModule.setTemp = function (value) { return (_temp = value); }; })((window.demoModule = window.demoModule || {}), window); |
1. 藉由 IIFE 的函式,在瀏覽器的全域中 ( window ) 掛上一個 demoModule 的 key-value。如果原本沒有這個 key-value ,那就以一個空 {} 開始。
2. 將 window.demoModule 和 window 兩個變數傳入 IIFE 函式內部,這樣一來就可以被使用到
3. 你可以在裡面自定義私有變數、給其他函式取用、設值的方法…等