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, email
et 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_field
ici pour deux raisons: names_with_underscores
ne sont pas du JavaScript idiomatique et field
n'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 id
sé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, email
est l'objet jQuery et emailElement
est l'élément DOM, mais dans l'autre, email
est l'élément DOM et emailJQ
est 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
, emailElement
et 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 emailElement
ou 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( ... );