Pregunta

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 pregunto acerca de la sintaxis de $ ('p.foo') que ve en jQuery y otros, pero las variables normales como $ nombre y $ order )

¿Fue útil?

Solución

Un uso muy común en jQuery es distinguir los objetos jQuery almacenados en variables de otras variables. Por ejemplo, yo 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 el código jQuery y facilita la visualización de los objetos jQuery que tienen un conjunto diferente de propiedades.

Otros consejos

En la 1ª, 2ª y 3rd Edition of ECMAScript , usando $ -prefixed los nombres de las variables fue explícitamente desaconsejado por la especificación, excepto en el contexto del código generado automáticamente:

  

El signo de dólar ( $ ) y el subrayado ( _ ) están permitidos en cualquier parte de un identificador. El signo de dólar está destinado solo para uso en código generado mecánicamente.

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

  

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

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

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

En resumen, puede usar el $ cuando lo desee. (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 los 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, Angular prefija los nombres de los objetos públicos con $ y los nombres de los objetos privados con $$ . No use 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 primera lista de correo de jQuery, así que permítame compartir parte de la historia y la motivación que la rodea.

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 $ , aún tendríamos dos nombres de variables diferentes aquí, email y email_field . Eso es bastante bueno allí mismo. ¿Por qué deberíamos lanzar un $ en uno de los nombres cuando ya tenemos dos nombres diferentes?

En realidad, no habría usado email_field aquí por dos razones: names_with_underscores no son JavaScript idiomático, y el campo no es realmente tiene sentido para un elemento DOM. Pero seguí la misma idea.

Probé 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 selectores id , 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, email es el objeto jQuery y emailElement es el elemento DOM, pero en el otro, email es el DOM element y emailJQ es el objeto jQuery.

No había consistencia y seguí mezclándolos. Además, era un poco molesto tener que inventar dos nombres diferentes para la misma cosa: uno para el objeto jQuery y otro para el elemento DOM correspondiente. Además de email , emailElement y emailJQ , también intenté otras variaciones.

Entonces noté un patrón común:

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

Dado que JavaScript trata a $ como simplemente otra letra para los nombres, y como siempre recibí un objeto jQuery de una llamada de $ (lo que sea) , el patrón finalmente comenzó. yo. Podría tomar una llamada de $ (...) y simplemente eliminar algunos caracteres, y obtendría un nombre bastante bonito:

$("#email")
$(email)

Strikeout no es perfecto, pero puedes tener una idea: con algunos caracteres eliminados, ambas líneas se ven así:

$email

Ahí fue cuando me di cuenta de que no necesitaba hacer una convención como emailElement o emailJQ . Ya había una buena convención mirándome: sacar algunos caracteres de una llamada de $ (lo que sea) y se convierte en $ lo que sea .

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, solo podía usar el mismo nombre con o sin el 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 dólar (en Javascript y en 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 tal vez no sea el más "raro" Lo que puedes 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 $$<*>quot;); }

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 a-z, A-Z, _, 0-9, etc ...

Dado que _ al comienzo de un nombre de variable a menudo se usa para indicar una variable privada (o al menos una que pretende ser privada), me parece que $ es conveniente para agregando frente a mis breves alias 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 utilizando php.js, etc.

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

También no desordena el código (ni requiere que se escriba más) al igual que 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 esto es solo mi propia convención.

Como he experimentado durante los últimos 4 años, permitirá a alguien identificar fácilmente si la variable señala 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 volver a envolver el objeto 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.

Si bien puedes usarlo simplemente para prefijar tus identificadores, se supone que se debe usar para el código generado, como los tokens de reemplazo en una plantilla, por ejemplo.

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

{varname} se utiliza para almacenar elementos generales como textos y cadenas. $ {varname} contiene elementos devueltos desde jQuery.

También puede utilizar {varname} para almacenar elementos de jQuery también, pero como dije al principio, esto lo distingue de las variables simples y lo hace mucho más fácil de entender (imagínese confundirlo con una variable simple y buscar por todas partes para entender lo que contiene).

Por ejemplo:

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

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

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

Angular se utiliza para las propiedades generadas por el marco. Supongo que están siguiendo la sugerencia (ahora desaparecida) proporcionada por la ECMA-262 3.0.

$ se utiliza para DISTINGUIR entre las variables comunes y las variables jQuery en el caso de las variables normales. le permite hacer un pedido en FLIPKART y luego, si el orden es una variable que le muestra el resultado de la cadena, se le denomina simple como " orden " pero si hacemos clic en realizar un pedido, se devuelve un objeto, ese objeto se denota por $ como " $ orden " para que el programador pueda eliminar las variables javascript y las variables jquery en todo el código.

Si ve el signo de dólar ($) o el signo de dólar doble ($$) y tiene curiosidad por lo que esto significa en el marco de 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 las convenciones de nombres de PHP con variables de javascript: Al realizar la validación de entrada, quiero ejecutar exactamente los mismos algoritmos del lado del cliente, y 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 de variables facilita esta tarea.

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

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

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

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top