Comment fonctionnent les espaces de noms de jQuery?

Question

Possible en double:
What does this JavaScript/jQuery syntax mean?

je veux dire précisément quand vous faites ceci:

(function ($) { 
    ... 
})(jQuery); 

Je ne l'ai jamais vu ce genre de syntaxe avant. Comment la fonction est appelée? Je comprends quand vous le faites comme ceci:

jQuery(function ($) { 
    ... 
}); 

parce que la fonction est passée à jQuery et jQuery juste à lancer une fonction passée en paramètre lorsque le DOM est prêt, mais le premier est différent.

Answer 1

en double de What does this JavaScript/jQuery syntax mean?

Je vais poster ma réponse ici, mais voir que Jeff Attwood nous semble vouloir embrasser la duplication: (http://blog.stackoverflow.com/2010/11/dr-strangedupe-or-how-i-learned-to-stop-worrying-and-love-duplication/)

---

Cette convention est utilisée lors de l'écriture des plugins pour assurez-vous qu'il n'y a pas de conflit avec les autres bibliothèques Javascript en utilisant la notation $, tout en vous assurant que l'auteur du plugin peut toujours utiliser cette notaion:

(function($){ 
    ... 
})(jQuery); 

L'auteur déclare une fonction anonyme avec un seul paramètre ($), puis l'appelle immédiatement et lui passe l'objet jQuery. Cela assure que la fonction est appelée et que tout est défini.

Une notation plus peut-être:

function MyDefs($){ 
    ... 
} 
MyDefs(jQuery); 

Bien que cela créerait une MyDefs variable dans l'espace de noms global. Le modèle de fonction anonyme laisse l'espace de noms global vide, évitant les conflits.

Answer 2

C'est une fonction anonyme. Lorsque vous écrivez:

(function ($){ 
    .. 
})(jQuery); 

Il est la plupart du temps équivalent à:

function the_function($) { 
    .. 
} 

the_function(jQuery); 

La seule différence étant que le premier ne crée pas une fonction appelée the_function et donc créé aucun risque d'écraser accidentellement une fonction existante ou variable avec ce nom. Et bien sûr, tout cela équivaut à:

function the_function() { 
    var $ = jQuery; 
    .. 
} 

the_function(); 

Le point de cette construction est que toutes les variables définies à l'intérieur the_function sont accidentellement local et ne peut donc pas remplacer toutes les variables ou les fonctions dans la portée globale. Par exemple, le code à l'intérieur de la fonction utilise $ pour représenter l'objet jQuery, mais cela entrerait en conflit avec d'autres bibliothèques qui utilisent également $ (comme Prototype). En enveloppant l'utilisation de $ dans une fonction, le code prototype en dehors de la fonction reste inchangé.