web-dev-qa-db-fra.com

RequireJS: Comment définir des modules qui contiennent une seule "classe"?

J'ai un certain nombre de "classes" JavaScript implémentées chacune dans son propre fichier JavaScript. Pour le développement, ces fichiers sont chargés individuellement et pour la production, ils sont concaténés, mais dans les deux cas, je dois définir manuellement un ordre de chargement, en m'assurant que B vient après A si B utilise A. Je prévois d'utiliser RequireJS comme une implémentation de CommonJS Modules/AsynchronousDefinition pour résoudre ce problème automatiquement pour moi.

Existe-t-il une meilleure façon de procéder que de définir des modules qui exportent chacun une classe? Sinon, comment nommer ce que le module exporte? Un module "employé" exportant une classe "Employé", comme dans l'exemple ci-dessous, ne me semble pas SEC assez.

define("employee", ["exports"], function(exports) {
    exports.Employee = function(first, last) {
        this.first = first;
        this.last = last;
    };
});

define("main", ["employee"], function (employee) {
    var john = new employee.Employee("John", "Smith");
});
javascriptcommonjsrequirejs
67
avernet

proposition AMD vous permet de renvoyer simplement une valeur pour l'objet exporté. Mais notez que c'est une caractéristique de la proposition AMD, c'est juste une proposition d'API, et il sera plus difficile de traduire le module en un module CommonJS normal. Je pense que c'est OK, mais des informations utiles à savoir.

Vous pouvez donc effectuer les opérations suivantes:

Je préfère les modules qui exportent une fonction constructeur pour commencer par un nom en majuscule, donc la version non optimisée de ce module serait également dans Employee.js

define("Employee", function () {
    //You can name this function here,
    //which can help in debuggers but
    //has no impact on the module name.
    return function Employee(first, last) {
        this.first = first; 
        this.last = last;
    };
});

Maintenant, dans un autre module, vous pouvez utiliser le module Employé comme ceci:

define("main", ["Employee"], function (Employee) {
    var john = new Employee("John", "Smith");
});
111
jrburke

En complément de la réponse de jrburke, notez que vous n'avez pas à retourner directement la fonction constructeur. Pour les classes les plus utiles, vous voudrez également ajouter des méthodes via le prototype, ce que vous pouvez faire comme ceci:

define('Employee', function() {
    // Start with the constructor
    function Employee(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
    }

    // Now add methods
    Employee.prototype.fullName = function() {
        return this.firstName + ' ' + this.lastName;
    };

    // etc.

    // And now return the constructor function
    return Employee;
});

En fait, c'est exactement le modèle montré dans cet exemple sur requirejs.org .

102
Mark Whitaker