J'étais la personne qui a créé cette convention en 2006 et l'a promue sur la première liste de diffusion jQuery, alors permettez-moi de partager une partie de l'histoire et de la motivation autour d'elle.
La réponse acceptée donne cet exemple:
var $email = $("#email"); // refers to the jQuery object representation of the dom object
var email_field = $("#email").get(0); // refers to the dom object itself
Mais cela ne l'illustre pas vraiment bien. Même sans le $, nous aurions toujours deux noms de variables différents ici, emailet email_field. C'est très bien ici. Pourquoi aurions-nous besoin de mettre un $dans l'un des noms alors que nous avons déjà deux noms différents?
En fait, je ne l'aurais pas utilisé email_fieldici pour deux raisons: names_with_underscoresne sont pas du JavaScript idiomatique et fieldn'ont pas vraiment de sens pour un élément DOM. Mais j'ai suivi la même idée.
J'ai essayé quelques choses différentes, parmi lesquelles quelque chose de très similaire à l'exemple:
var email = $("#email"), emailElement = $("#email")[0];
// Now email is a jQuery object and emailElement is the first/only DOM element in it
(Bien sûr, un objet jQuery peut avoir plus d'un élément DOM, mais le code sur lequel je travaillais avait beaucoup de idsélecteurs, donc dans ces cas, il y avait une correspondance 1: 1.)
J'ai eu un autre cas où une fonction a reçu un élément DOM en tant que paramètre et avait également besoin d'un objet jQuery pour cela:
// email is a DOM element passed into this function
function doSomethingWithEmail( email ) {
var emailJQ = $(email);
// Now email is the DOM element and emailJQ is a jQuery object for it
}
Eh bien, c'est un peu déroutant! Dans l'un de mes morceaux de code, emailest l'objet jQuery et emailElementest l'élément DOM, mais dans l'autre, emailest l'élément DOM et emailJQest l'objet jQuery.
Il n'y avait aucune consistance et je continuais à les mélanger. De plus, c'était un peu gênant de devoir inventer deux noms différents pour la même chose: un pour l'objet jQuery et un autre pour l'élément DOM correspondant. De plus email, emailElementet emailJQ, j'ai continué à essayer d'autres variantes aussi.
Ensuite, j'ai remarqué un schéma commun:
var email = $("#email");
var emailJQ = $(email);
Étant donné que JavaScript traite $simplement comme une autre lettre pour les noms, et comme je récupère toujours un objet jQuery à partir d'un $(whatever)appel, le modèle est finalement apparu sur moi. Je pourrais prendre un $(...)appel et simplement supprimer certains caractères, et cela donnerait un nom assez sympa:
$("#email")
$(email)
Strikeout n'est pas parfait, mais vous pouvez avoir l'idée: avec certains caractères supprimés, ces deux lignes finissent par ressembler à:
$email
C'est alors que j'ai réalisé que je n'avais pas besoin de créer une convention comme emailElementou emailJQ. Il y avait déjà une belle convention qui me fixait: retirer certains personnages d'un $(whatever)appel et ça se transforme en $whatever.
var $email = $("#email"), email = $email[0];
// $email is the jQuery object and email is the DOM object
et:
// email is a DOM element passed into this function
function doSomethingWithEmail( email ) {
var $email = $(email);
// $email is the jQuery object and email is the DOM object
// Same names as in the code above. Yay!
}
Je n'ai donc pas eu à inventer deux noms différents tout le temps, mais je pouvais simplement utiliser le même nom avec ou sans $préfixe. Et le $préfixe était un bon rappel que j'avais affaire à un objet jQuery:
$('#email').click( ... );
ou:
var $email = $('#email');
// Maybe do some other stuff with $email here
$email.click( ... );