Как можно упростить преобразование функции в модуль в RequireJS?

Question

Я читал документацию, но я не могу сделать это простым способом. Я думаю, что я слишком сильно путаю это с node.js который использует те же слова, например require, exports, module и т.п.

Представьте себе основной сценарий примерно так. (И представьте, функции сложны)

require(['jquery', 'domReady!'], function($) {

    $("#staticButton").click(function() {
        showMessage('What does this button do?');
    });

    function showMessage(message) {
        alert(message);
    }

});

Теперь представьте, что я хочу использовать showMessage() в нескольких сценариях. Как мне на самом деле это сделать?

В Node.js Я бы прикрепил showMessage() в exports.showMessage внутри showMessage.js и делать что-то подобное везде, где я хочу использовать это:

require(['jquery', 'domReady!'], function($) {

    var showMessage = require('showMessage'); // Easy huh?

    $("#staticButton").click(function() {
        showMessage('What does this button do?');
    });

});

Но с RequireJS это дает мне ошибку, что мне сначала нужно загрузить его. Нужно ли мне require или же define это, прежде чем я могу использовать вышеуказанный синтаксис? Мне действительно нужно добавить его в основной скрипт require массив? Мне это не нравится Что делать, если у вас есть 20 функций?

require(['jquery', 'domReady!', func01, func02, (...) func20], function($, empty, func01, func02, (...) func20) {}

Это чистая синтаксическая соль. мне нравится Node.js сахар лучше:

var func01 = require(func01),
    func02 = require(func02),
    (...)
    func20 = require(func20);

Я слишком сильно путаю их. Может кто-нибудь объяснить, как я просто помещаю функции во внешние файлы и использую их как можно проще?

---

Я предполагаю, что функция превращенного модуля должна выглядеть так:

define(function(require, exports, module) {
    return function(message) {
        alert(message);
    }
});

... но если это можно сделать проще, я хотел бы услышать об этом.

Answer 1

Вы должны попытаться думать с точки зрения модулей, функции являются чем-то более низким уровнем в этом контексте. Вы определяете модули, требуя, чтобы они позже возвращали свой публичный "интерфейс" как объект с некоторыми свойствами, которые могут оказаться функциями.

То, что я нашел полезным, было шаблоном "static utils module":

utils.js

define(function () {
    return {
        showMessage: function (text) {
            alert(text);
        },
        foo: function () {
            alert('bar');
        }
    }
})

Или упрощенный эквивалент: (-> документы)

utils.js

define({
    showMessage: function (text) {
        alert(text);
    },
    foo: function () {
        alert('bar');
    }
});

Затем внутри вашего main.js:

define(['utils'], function (Utils) {
    Utils.showMessage('!');
})

Если у вас слишком много зависимостей (что, кстати, обычно указывает на то, что ваш модуль слишком много делает), вы можете использовать вместо этого синтаксис сахар:

define(function (require) {
    var Utils = require('utils');
    Utils.showMessage('!');
})