web-dev-qa-db-fra.com

Différence entre require () et define () dans RequireJS?

Dans RequireJS, quelle est la différence fondamentale entre l'utilisation de require () Vs define ();

require(['a'], function(a) {
    // some code
});

// A.js
define(['b','c','d','e'], function() {
    //some code
});

Tout cas d'utilisation serait très utile ..

javascriptrequirejsamd
29
testndtv

Une différence fondamentale qui m'a ennuyé au début était de comprendre qu'un define pourrait ne jamais être appelé .

Tant qu'il n'y a qu'un seul define par fichier, il enregistrera ce module comme disponible sous ce nom de fichier. Cependant, les modules define ne sont chargés qu'une fois qu'une fonction require demande chacun d'eux.

Définir: si vous avez besoin d'un XXX, chargez d'abord ces autres choses, puis retournez le résultat de cette fonction.

Obligatoire: chargez ces autres éléments, puis exécutez cette fonction. (pas de "si")

Exemple: Disons que vous incluez ce fichier JS dans votre page:

// this is in company/welcomepage.js
define(['company/ui_library'],
    function(uiLib) {
        console.log('Welcome to {company}!');
    }
);

Si c'est le seul fichier Javascript, vous pouvez ouvrir votre page, et il n'y aurait rien dans le journal de la console, malgré le script lui disant d'accueillir l'utilisateur. Cependant, cela change si quelque part dans la page ou dans un autre script, vous insérez ce qui suit:

require(['company/welcomepage'], function() {
    // optionally insert some other page-initialization logic here
});

Maintenant, la page mettra un message de bienvenue dans la console lors de son chargement.

En fait, avec ce second en place, il ne serait pas nécessaire manuellement d'inclure welcomepage.js en tant que <script> tag; il le chargerait de son emplacement dès qu'il verrait le besoin et se rendrait compte qu'il en a besoin.

49
Katana314

require et requirejs sont les mêmes.

require === requirejs // true

require est un moyen de charger un module qui a été défini. Par exemple, pour charger le module logger, je pourrais faire:

require(["logger"], function(logger){
  logger.bla("S");
});

Ici, j'appelle require, en spécifiant un module déjà défini appelé logger et en l'utilisant en appelant sa méthode bla.

define est un moyen de définir un module. Par exemple pour définir un module logger je pourrais faire:

// logger.js
define(function(){
  return {
    bla: function(x){
      alert(x);
    }
  }
});

Ici, j'ai appelé define et défini le module logger. dans ce module, j'ai renvoyé la fonction bla que je veux exposer.

Parfois, define ressemble beaucoup aux exportations parce que define peut aussi dépendre et utiliser d'autres modules tout comme require peut utiliser d'autres modules. Permettez-moi de vous montrer le même module logger, cette fois en utilisant un module

// logger.js
define(["popup"], function(popup){
  return {
    bla: function(x){
      popup.show(x);
    }
  }
});

Ici, le module enregistreur I defined, a également une dépendance appelée popup et ressemble donc à require.

18
user566245

Je crois que vous utilisez toujours define pour vos définitions de module. Vous avez plusieurs variantes pour le faire, vous pouvez définir un module avec ses dépendances dans un tableau comme premier argument à définir (comme dans l'exemple que vous avez publié).

Ou vous pouvez utiliser le wrapper CommonJS simplifié , quelque chose comme ceci:

define(function (require) {
    var otherModule = require('otherModule');
    return function () {
        return otherModule.operation();
    };
});

Peut-être que vous vous êtes mélangé au format dépendance du service JSONP , qui utilise require () pour charger le service, puis spécifiez define () comme rappel JSONP qui définira éventuellement le module une fois que le service répondra.

Donc à la fin, vous utilisez define () pour définir les modules, et require () pour les charger.

1
Joni Bekenstein