Я получил файл JS с ~ 2000 строками кода (не минимизирован / с комментариями), и я стремлюсь оптимизировать способ хранения функций и их область действия, чтобы избежать спама в глобальной области.АКА создай что-нибудь приятное.
Это мой первый "модуль / библиотека".
Начнем с простой библиотеки, которая будет включена в веб-страницу:
(function() {
console.log('Awesome')
}).call(this)
Библиотеку можно вызывать внутри веб-страницы, IFrame или веб-пользователя и выполнять разные функции в зависимости от среды.
Прямо сейчас мой подход похож на этот:
MyModule.js:
(function() {
// Detect if running in a webworker
function isWebworker() {
if (window.document === undefined) {
return true;
} else {
return false;
}
}
// Detect if the script is running inside an IFrame
function isIFrame () {
try {
return window.self !== window.top;
} catch (e) {
return true;
}
}
function createModal() {}
function clickModal() {}
function calculate() {}
function createWorker() {}
if(isWebworker()) {
var ww = function() {}
ww.prototype.size = 512;
ww.prototype.calc = calculate;
} else if(isIFrame()) {
// Some functions here will be in window.MyModule, others are private.
} else {
// Is main window - probably
// Some functions here will be in window.MyModule, others are private.
var drawer = function() {}
drawer.prototype.drawtime = null;
drawer.prototype.draw = draw;
if(window.MyModule) {
window.MyModule = {};
window.MyModule.drawer = drawer;
} else {
window.MyModule.drawer = drawer;
}
}
}).call(this)
includeMyModule.js (используется только в главном окне):
(function() {
var ModuleName = 'MyModule';
if (!window[ModuleName]) {
window[ModuleName] = {};
}
window[ModuleName].ready = window[ModuleName].ready || function(rd) {
(window[ModuleName]['rand'] = window[ModuleName]['rand'] || []).push(rd);
};
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src = '/MyModule.min.js';
var ss = document.getElementsByTagName('script')[0];
ss.parentNode.insertBefore(s, ss);
})();
Надеюсь, я понял.