Javascript Girl
  1. Javascript Girl
  3. Exige, ce que signifie "Requirejs charge chaque module une fois"
Intereting Posts
Comment transférer des variables locales lors de l'affectation de mouseover via une fonction anonyme? La valeur du paramètre de fonction par défaut dans safari ne fonctionne pas Besoin d'une autre aide pour afficher dynamiquement le texte sur l'écran Editeur en ligne CKEditor sur les éléments d'un iframe Peoplesoft écrans dans un iFrame Javascript, obtenez-vous l'objet ancré parent? Valider le montant de la devise en utilisant des expressions régulières en JavaScript RangeError: code d'état non valide: 0 JavaScript: Uncaught TypeError: Impossible de lire la propriété 'style' de null VueJS et tinyMCE, directives personnalisées Comment ouvrir une fenêtre optimisée avec Javascript? SetContent d'une zone de texte avec tinyMCE Javascript – Calcul de l'âge Est-il possible d'utiliser JSP / JSTL pour générer des fichiers css / javascript dynamiques? Changer les marqueurs individuels dans les directions Google Maps

Exige, ce que signifie "Requirejs charge chaque module une fois"

Donc, si j'ai un module comme: 

//test1.js define([], function() { var counter = 0; return { increment: function() { counter++ } }; });

Requirejs va charger ce module une fois (pour être conscient des variables locales de ce module) et jamais plus? Le compteur variable sera actif à travers la fermeture à partir de l'objet de retour (grâce à la fonction d'incrémentation)?

Qu'en est-il de l'exemple suivant? 

 //test2.js define([], function() { var value = 10; document.getElementById('asd').addEventListener('mousedown', function(e) { value = Math.random(); }); return value; });

Avec cette structure de code, cet événement ne se déclenche jamais parce que requirejs va charger / exécuter ceci une seule fois? La valeur exportée ici sera de 10 et ne pourra-t-elle pas être modifiée? Donc, pour cet exemple, je n'ai qu'une seule solution et renvoie une fonction à partir de ce module (quand je veux que l'effet "exécute ce module plus d'une fois" soit définitivement)?

C'est donc ce moyen correct de le faire? 

 //test3.js define([], function() { return function() { return Math.random(); }; }); //test4.js define(['test3'], function(test) { document.getElementById('asd').addEventListener('mousedown', function(e) { alert(test()); }); });

Fell free pour publier tout autre piège que vous trouviez intéressant sur Requirejs.

Que diriez-vous quelque chose comme ça: 

 define([], function() { var value = 10; document.getElementById('asd').addEventListener('mousedown', function(e) { value = Math.random(); }); return { getValue: function(){return value;} }; });

La valeur de la variable conservera son état interne à la fonction de définition, mais quand elle est retournée par définir le résultat est passée par valeur (non par ref) qui ne sera jamais mise à jour.

Au lieu de cela, vous pouvez renvoyer une méthode qui vous procurera la valeur actuelle de votre valeur lorsque vous l'appelez. Cela signifie que vous pouvez récupérer la valeur actualisée

À la fin, il est très facile à comprendre. Tout nécessiteJs est, est d'évaluer la fonction passée et de retourner le même résultat à chaque module qui l'exige. Donc, si vous avez besoin du résultat du dernier mousedown, vous devez renvoyer soit un objet contenant la valeur, soit une fonction qui renvoie la valeur: 

 define([], function () { var result = {value:10}; //the listener is bound when the module loads, maybe you should wrap this in domLoad listener as well document.getElementById('asd').addEventListener('mousedown', function (e) { result.value = Math.random(); }); return result; }); define(['test2'], function (test2) { var value = test2.value; }); define([], function () { var result = {value:10}; document.getElementById('asd').addEventListener('mousedown', function (e) { result.value = Math.random(); }); return result; }); define(['test2'], function (test2) { var value = test2(); });