¿Por qué una variable de JavaScript comenzaría con un signo de dólar? [duplicar]

A menudo veo JavaScript con variables que comienzan con un signo de dólar. ¿Cuándo / por qué elegirías prefijar una variable de esta manera?

(No estoy preguntando acerca de la $('p.foo')sintaxis que ves en jQuery y otros, sino variables normales como $namey $order)

El uso muy común en jQuery es distinguir los objetos jQuery almacenados en variables de otras variables.

Por ejemplo, definiría:

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

Considero que esto es muy útil para escribir código jQuery y hace que sea fácil ver los objetos jQuery que tienen un conjunto diferente de propiedades.

En la 1ra, 2da y 3ra edición de ECMAScript , el uso de nombres de variables con prefijo $ fue desalentado explícitamente por la especificación, excepto en el contexto del código autogenerado:

El signo de dólar ( $) y el guión bajo ( _) están permitidos en cualquier parte de un identificador. El signo de dólar está diseñado para usarse solo en código generado mecánicamente.

Sin embargo, en la próxima versión (la quinta edición , que es actual), esta restricción se eliminó y el pasaje anterior se reemplazó por

El signo de dólar ( $) y el guión bajo ( _) están permitidos en cualquier parte de un IdentifierName .

Como tal, el signo $ ahora se puede usar libremente en nombres de variables. Ciertos marcos y bibliotecas tienen sus propias convenciones sobre el significado del símbolo, señalado en otras respuestas aquí.

Como otros han mencionado, el signo de dólar está destinado a ser utilizado por código generado mecánicamente. Sin embargo, esa convención ha sido rota por algunas bibliotecas JavaScript muy populares. JQuery, Prototype y MS AJAX (AKA Atlas) usan este carácter en sus identificadores (o como un identificador completo).

En resumen, puedes usar el $cuando quieras. (El intérprete no se quejará). La pregunta es cuándo quiere usarlo.

Yo personalmente no lo uso, pero creo que su uso es válido. Creo que MS AJAX lo usa para indicar que una función es un alias para una llamada más detallada.

Por ejemplo:

var $get = function(id) { return document.getElementById(id); }

Eso parece una convención razonable.

En el contexto de AngularJS, el $prefijo se usa solo para identificadores en el código del marco. Los usuarios del marco tienen instrucciones de no usarlo en sus propios identificadores:

Espacios de nombres angulares $y$$

Para evitar colisiones accidentales de nombres con su código, prefijos angulares nombres de objetos públicos con $y nombres de objetos privados con $$. No utilice el prefijo $o $$en su código.

Fuente: https://docs.angularjs.org/api

Fui la persona que originó esta convención en 2006 y la promocioné en la lista de correo de jQuery, así que permítanme compartir algo de la historia y la motivación en torno a ella.

La respuesta aceptada da este ejemplo:

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

Pero eso realmente no lo ilustra bien. Incluso sin el $, todavía tendríamos dos nombres de variables diferentes aquí, emaily email_field. Eso es bastante bueno allí mismo. ¿Por qué tendríamos que agregar $uno a uno de los nombres cuando ya tenemos dos nombres diferentes?

En realidad, no lo habría usado email_fieldaquí por dos razones: names_with_underscoresno son JavaScript idiomático y fieldrealmente no tiene sentido para un elemento DOM. Pero seguí la misma idea.

Intenté algunas cosas diferentes, entre ellas algo muy similar al ejemplo:

var email = $("#email"), emailElement = $("#email")[0];
// Now email is a jQuery object and emailElement is the first/only DOM element in it

(Por supuesto, un objeto jQuery puede tener más de un elemento DOM, pero el código en el que estaba trabajando tenía muchos id selectores, por lo que en esos casos había una correspondencia 1: 1).

Tuve otro caso en el que una función recibió un elemento DOM como parámetro y también necesitaba un objeto jQuery para ello:

// 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
}

Bueno, eso es un poco confuso! En uno de mis bits de código, emailestá el objeto jQuery y emailElementes el elemento DOM, pero en el otro, emailes el elemento DOM y emailJQes el objeto jQuery.

No hubo consistencia y seguí mezclándolos. Además, era un poco molesto seguir teniendo que inventar dos nombres diferentes para la misma cosa: uno para el objeto jQuery y otro para el elemento DOM correspondiente. Además email, emailElementy emailJQ, seguí probando otras variaciones también.

Entonces noté un patrón común:

var email = $("#email");
var emailJQ = $(email);

Como JavaScript trata $simplemente como otra letra para los nombres, y dado que siempre recibí un objeto jQuery de una $(whatever)llamada, el patrón finalmente se me ocurrió . Podría tomar una $(...)llamada y simplemente eliminar algunos caracteres, y aparecería con un nombre bastante agradable:

$("#email")
$(email)

Strikeout no es perfecto, pero puede tener la idea: con algunos caracteres eliminados, ambas líneas terminan pareciendo:

$email

Fue entonces cuando me di cuenta de que no necesitaba inventar una convención como emailElemento emailJQ. Ya había una buena convención mirándome: sacar algunos caracteres de una $(whatever)llamada y se convierte en $whatever.

var $email = $("#email"), email = $email[0];
// $email is the jQuery object and email is the DOM object

y:

// 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!
}

Así que no tuve que inventar dos nombres diferentes todo el tiempo, pero podría usar el mismo nombre con o sin $prefijo. Y el $prefijo fue un buen recordatorio de que estaba tratando con un objeto jQuery:

$('#email').click( ... );

o:

var $email = $('#email');
// Maybe do some other stuff with $email here
$email.click( ... );

Stevo tiene razón, el significado y el uso del signo de script en dólares (en Javascript y la plataforma jQuery, pero no en PHP) es completamente semántico. $ es un carácter que se puede usar como parte de un nombre de identificador. Además, el signo de dólar quizás no sea lo más "extraño" que pueda encontrar en Javascript. Aquí hay algunos ejemplos de nombres de identificadores válidos:

var _       = function() { alert("hello from _"); }
var \u0024  = function() { alert("hello from $ defined as u0024"); }
var Ø       = function() { alert("hello from Ø"); }
var $$$$$   = function() { alert("hello from $$$$$"); }

Todos los ejemplos anteriores funcionarán.

Pruébalos.

El carácter $ no tiene un significado especial para el motor de JavaScript. Es solo otro carácter válido en un nombre de variable como az, AZ, _, 0-9, etc.

Como _al principio del nombre de una variable se usa a menudo para indicar una variable privada (o al menos una destinada a permanecer privada), encuentro$ conveniente agregar delante de mis propios alias breves a las bibliotecas de códigos genéricos.

Por ejemplo, cuando uso jQuery, prefiero usar la variable $J(en lugar de solo $) y usar$P cuando uso php.js, etc.

El prefijo lo hace visualmente distinto de otras variables, como mis propias variables estáticas, lo que me indica el hecho de que el código es parte de una biblioteca u otra, y es menos probable que entre en conflicto o confunda a otros una vez que conocen la convención.

Tampoco abarrota el código (o requiere un tipeo adicional) como lo hace un nombre completamente especificado que se repite para cada llamada a la biblioteca.

Me gusta pensar que es similar a lo que hacen las teclas modificadoras para ampliar las posibilidades de las teclas individuales.

Pero esta es solo mi propia convención.

Como he experimentado durante los últimos 4 años, permitirá a alguien identificar fácilmente si la variable apunta a un valor / objeto o un elemento DOM envuelto en jQuery

Ex:
var name = 'jQuery';
var lib = {name:'jQuery',version:1.6};

var $dataDiv = $('#myDataDiv');

En el ejemplo anterior, cuando veo la variable "$ dataDiv", puedo decir fácilmente que esta variable apunta a un elemento DOM envuelto en jQuery (en este caso es div). y también puedo llamar a todos los métodos jQuery sin envolver el objeto nuevamente como $ dataDiv.append (), $ dataDiv.html (), $ dataDiv.find () en lugar de $ ($ dataDiv) .append ().

Espero que pueda ayudar. así que finalmente quiero decir que será una buena práctica seguir esto, pero no es obligatorio.

${varname} es solo una convención de nomenclatura que los desarrolladores de jQuery usan para distinguir las variables que contienen elementos de jQuery.

Plain {varname}se usa para almacenar cosas generales como textos y cadenas. ${varname}contiene elementos devueltos por jQuery.

Puedes usar llano {varname} para almacenar elementos jQuery, pero como dije al principio, esto lo distingue de las variables simples y hace que sea mucho más fácil de entender (imagine confundirlo para una variable simple y buscar todo para comprender lo que contiene) .

Por ejemplo :

var $blah = $(this).parents('.blahblah');

Aquí, bla está almacenando un elemento jQuery devuelto.

Entonces, cuando alguien más vea el $blahcódigo, entenderá que no es solo una cadena o un número, es un elemento jQuery.

Si bien simplemente puede usarlo para prefijar sus identificadores, se supone que debe usarse para el código generado, como tokens de reemplazo en una plantilla, por ejemplo.

Los usos angulares son para propiedades generadas por el marco. Supongo que siguen la pista (ahora desaparecida) proporcionada por el ECMA-262 3.0.

$ se usa para DISTINGUIR entre variables comunes y variables jquery en el caso de variables normales. le permite hacer un pedido en FLIPKART y, si el pedido es una variable que le muestra la salida de la cadena, se denomina simple como "pedido", pero si hacemos clic en colocar pedido, se devuelve un objeto que se denotará con $ como "$ orden "para que el programador pueda cortar las variables de JavaScript y las variables de jquery en todo el código.

Si ve el signo de dólar ($) o el doble signo de dólar ($$) y siente curiosidad por saber qué significa esto en el marco del prototipo, aquí está su respuesta:

$$('div');
// -> all DIVs in the document.  Same as document.getElementsByTagName('div')!

$$('#contents');
// -> same as $('contents'), only it returns an array anyway (even though IDs must be unique within a document).

$$('li.faux');
// -> all LI elements with class 'faux'

Fuente:
http://www.prototypejs.org/api/utility/dollar-dollar

La razón por la que a veces uso convenciones de nombre de php con variables de JavaScript: cuando valido la entrada, quiero ejecutar exactamente los mismos algoritmos tanto del lado del cliente como del lado del servidor. Realmente quiero que los dos lados del código se vean lo más similares posible, para simplificar el mantenimiento. El uso de signos de dólar en nombres variables hace que esto sea más fácil.

(Además, algunas funciones auxiliares juiciosas ayudan a hacer que el código se vea similar, por ejemplo, envolver búsquedas de valor de entrada, versiones no strings de strlen, substr, etc. Sin embargo, aún requiere algunos ajustes manuales).

Un identificador de JavaScript válido shuold debe comenzar con una letra, guión bajo (_) o signo de dólar ($); Los caracteres posteriores también pueden ser dígitos (0-9). Debido a que JavaScript distingue entre mayúsculas y minúsculas, las letras incluyen los caracteres "A" a "Z" (mayúsculas) y los caracteres "a" a "z" (minúsculas).

Detalles:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#Variables