jQuery Girl
  1. jQuery Girl
  3. Est-il possible d’appeler une fonction JavaScript dans une expression de fonction appelée immédiatement
Intereting Posts
Modifier le style sur une ligne dans JQuery Datatables lors de la modification des valeurs affichées Sélectionnable (multiple) + sortingable avancé Sérialiser l’object javascript sur json et retour afficher le fichier html dans un div demande inter-domaine renvoyant Uncaught SyntaxError: Jeton inattendu: erreur Meilleure approche pour la barre de profil utilisateur Création de plug-in jQuery: Pourquoi certains font-ils jQuery.pluginName et d’autres jQuery.fn.pluginName? En-tête collant – Défilement – CSS / jQuery Calcul du prix basé sur la distance parcourue Comment actualiser le contenu de la table dans div en utilisant jquery / ajax Comment sérialiser plusieurs listes avec JQuery éditeur xml basé sur jquery utilisant des schémas xml Comment puis-je basculer entre 2 images Fonction JS permettant de saisir uniquement des lettres et des espaces Objet JQuery + SVG: capturer l’événement de clic correctement

Est-il possible d’appeler une fonction JavaScript dans une expression de fonction appelée immédiatement

J’utilise jQuery et une fonction est encapsulée dans une expression de fonction immédiatement invoquée comme ceci: 

  (function ($) { var message = 'x called'; function x() { alert(message); } })(jQuery); x();

Cela entraînera une erreur car la fonction “x” n’est pas définie en dehors de l’expression de fonction immédiatement invoquée. Est-il possible d’appeler la fonction “x” en dehors de l’expression de fonction immédiatement invoquée?

Créez un espace de noms pour d’autres classes ou fonctions avec lesquelles vous voudrez peut-être faire cela. Vous ne voulez pas polluer continuellement l’espace de noms global, mais rien n’empêche de créer un seul espace de noms global et de placer vos éléments individuels sous celui-ci: 

 (function($){ window.MyNamespace = function(){}; var message = "Something here"; $.extend(MyNamespace, { x: function(){ alert(message); } }); })(jQuery) MyNamespace.x()

Seulement si vous exposez la fonction d’une manière ou d’une autre. Par exemple, vous pouvez le retourner à partir de la fonction externe: 

 var x = (function ($) { var message = 'x called'; function x() { alert(message); } return x; })(jQuery); x();

Ou, de la même manière, vous pouvez le retourner sur un object: 

 var obj = (function ($) { var message = 'x called'; function x() { alert(message); } return {"x": x}; })(jQuery); obj.x();

Les fonctions et les variables déclarées à l’intérieur d’une fonction ne sont pas directement accessibles de l’extérieur de cette fonction, sauf si vous leur donnez le moyen d’y accéder en renvoyant quelque chose ou en donnant une référence à une variable déclarée en dehors de cette fonction.

Vous pouvez changer votre code comme suit:

Lien jsFiddle pour cela: http://jsfiddle.net/aLnbn/

Oui, (une solution consiste à:) le renvoyer à partir de l’IIFE à l’aide d’une instruction return, vous devez également “attraper” le retour en affectant une variable à l’IIFE 

 var foo = (function(){ return your_function; }());

Vous pouvez accéder à votre méthode en utilisant votre IIFE pour renvoyer (ou augmenter) une variable globale.

Vous pourriez le faire comme ceci: 

 var globalObject = (function (theObject, $) { if (theObject.theMethod) { return theObject; } var message = 'theMethod called'; theObject.theMethod = function () { alert(message); }; return theObject; })(globalObject || {}, jQuery); globalObject.theMethod();

Le modèle que nous utilisons est légèrement meilleur.

Nous avons un object global (espace de nom) et nous y ajoutons des modules en important des fichiers js contenant des fichiers IIFE.

Chaque IIFE ajoute un nouveau module à un seul object global.

Cela fait en sorte que l’ensemble de notre projet ne comporte qu’un seul object global pouvant éventuellement utiliser l’un de nos modules en incluant un fichier.

Je recommande de consulter cet article, qui est une bonne discussion sur le modèle de module JavaScript:

Essaye ça: 

 var miFunc = (function($) { var message = 'x called'; function x() { console.log(message); } this.x = x; return this; })(jQuery); miFunc.x();

Test: http://jsbin.com/erucix/2/edit

L’un des objectives d’une fermeture est de limiter la scope. C’est pourquoi x() est défini et peut être appelé à l’intérieur de votre expression de fonction immédiatement invoquée, mais n’est pas défini à l’extérieur.

Pour que votre code fonctionne sans refactoring, vous pouvez tirer parti de la grammaire JS qui différencie une instruction de fonction d’un opérateur de fonction . Les deux sont sémantiquement identiques, mais cette dernière peut être assignée à une variable qui convient parfaitement à votre scénario: 

 var x; //scoped *outside* of the closure (function ($) { var message = 'x called'; x = function() { alert(message); } })(jQuery); x(); //alerts 'x called'

Vous pouvez accéder à votre méthode en utilisant votre IIFE pour renvoyer une variable globale. 

 //IIFEs - Immediately Invoked Function Expressions var namespaceTestIIFE = (function ($) { /** Public functions and state. */ var pub = {}; $(document).ready(function () { //your on ready logic }); pub.testAlert = function () { alert('Hello TestAlert'); } return pub; })(jQuery);

OU 

 var compareForm = (function () { /** Public functions and state. */ var pub = {}; pub.testAlert = function () { alert('Hello TestAlert'); } return pub; }());

Pour accéder à la fonction, utilisez “namespace.functionname” par exemple – 

 namespaceTestIIFE.testAlert();