Javascript: Объявление функций, которые будут использоваться глобально с использованием модулей - PullRequest
Новая
       6

Javascript: Объявление функций, которые будут использоваться глобально с использованием модулей

0 голосов
/ 28 июня 2018

Я ищу способ иметь common.js, если хотите, с некоторыми функциями, которые будут использоваться в других js-скриптах ниже по иерархии .

Обычно я делаю это, просто объявив такую ​​функцию: function x(){...} для последующего вызова из некоторого другого js . Однако я столкнулся с некоторыми проблемами с этим подходом, когда попытался проанализировать и собрать все мои файлы .js с помощью Uglifyjs. После некоторых исследований я узнал некоторые преимущества использования модулей javascript чтобы решить мою проблему, а также стремиться к лучшей практике.

Я нашел довольно аккуратное решение, используя модули здесь: Javascript: лучший способ объявить функции, которые будут использоваться глобально?

Код соответствует моим потребностям:

Раздел модулей не определен должным образом ... вот немного приведенный в порядок пример. 

window.MainModule = (function($, win, doc, undefined) {
    var modules = {};

    // -- Create as many modules as you need ...
    modules["alerter"] = (function(x,y){
        var someFunction = function(){ alert(xy); };

        return { 
            init: someFunction
        };
    }());

    modules["alerter2"] = (function(){
        var someFunction = function(){ alert('I alert second'); };

        return { 
            init: someFunction
        };
    }());

    return { 
        init: function(key){
        modules[key].init();
        }
    };
}(jQuery, this, document));

$(window.MainModule.init['alerter']);

Проблема, с которой мне нужна помощь, заключается в том, что я хочу инициализировать module['alerter'] и предоставить аргументы функции 

modules["alerter"] = (function(x,y){
    var someFunction = function(){ alert(xy); };            
    return { 
        init: someFunction
    };
}());

с использованием $(window.MainModule.init['alerter']).

Я пытался быть конкретным в области, которая является довольно новой для меня. Конечно, я благодарен за вашу помощь.

Ответы [ 3 ]

0 голосов
/ 28 июня 2018

почему бы вам не сделать следующее: 

window.MainModule = (function($, win, doc, undefined) {
    var modules = {};

    // -- Create as many modules as you need ...
    modules["alerter"] = (function(){
        var someFunction = function(x,y){ alert(x+y); return this;};

        return { 
            init: someFunction
        };
    }());

    modules["alerter2"] = (function(){
        var someFunction = function(){ alert('I alert second'); return this;};

        return { 
            init: someFunction
        };
    }());

    return { 
        module: function(key){
          return modules[key];
        }
    };
}(jQuery, this, document));

тогда вы можете назвать это так: 

window.MainModule.module('alerter').init(1,2).init(2,3).init(3,4); 
window.MainModule.module('alerter2').init().init();
0 голосов
/ 29 июня 2018

Я закончил тем, что реализовал ' babel ' с minify для поддержки es6 и для решения проблемы ish с анализом / mash файлов .js. Спасибо за хорошие ответы:)

0 голосов
/ 28 июня 2018

Если ваш проект поддерживает es6, у вас может быть «mainModule.js» следующего содержания: 

const alerter = function(x,y) {alert(x,y);};
const alerter2 = function() {alert('I alert second');};
export default {
  alerter,
  alerter2
}

И в файле вам нужно использовать alertter илиlerter2, вы просто: 

import {alerter, alerter2} from 'path/to/mainModule.js';
alerter(param1, param2); 
alerter2();

Поскольку у вас есть этот метод "init", я думаю, вы хотите создать классы "aleter" и "aleter2". Вы также можете использовать класс javascript, чтобы заставить его работать. https://caniuse.com/#search=Class

...