¿Cuál es el significado del signo "$" en JavaScript

167

En el siguiente código JavaScript hay un $signo de dólar ( ). Qué significa eso?

$(window).bind('load', function() {
    $('img.protect').protectImage();
});
coderex
fuente
1
Ver también: stackoverflow.com/a/553734/43615 (¿Por qué una variable de JavaScript comenzaría con un signo de dólar?)
Thomas Tempelmann

Respuestas:

284

Su fragmento de código parece que hace referencia a métodos de una de las bibliotecas populares de JavaScript (jQuery, ProtoType, mooTools, etc.).

No hay nada misterioso sobre el uso de $JavaScript. $es simplemente un identificador de JavaScript válido.

JavaScript permite letras mayúsculas y minúsculas, números y $y _. El $estaba destinado a ser utilizado para las variables generadas por la máquina (tales como $0001).

Prototype, jQuery y la mayoría de las bibliotecas javascript usan $como el objeto base primario (o función). La mayoría de ellos también tienen una manera de renunciar a él $para que pueda usarse con otra biblioteca que lo use. En ese caso, usa en jQuerylugar de $. De hecho, $es solo un atajo para jQuery.

Nosredna
fuente
2
@Paolo: No estoy seguro exactamente a qué te refieres. (El mío anteriormente era el aceptado, supongo). Bueno, pensé que el mío era completamente correcto al menos. Esto incluye un poco de información auxiliar, pero no estoy seguro de que justifica la "gran" ...
noldorin
1
@Noldorin: la información auxiliar es algo bueno. Su pregunta no mencionó absolutamente la razón por la que se usó $, la razón por la que podría usarse, y el hecho de que jQuery es solo una de las muchas bibliotecas que lo usan. Tenerlo como una respuesta aceptada significa que es la mejor respuesta posible para una pregunta, y no lo fue.
Paolo Bergantino
+1 Primero es un identificador de JavaScript válido y los marcos de JavaScript lo usan a menudo como un segundo alias.
Gumbo
@Paolo: A menudo sí. Sin embargo, no había indicios de que el OP quisiera saber sobre esto. Una respuesta directa también es algo bueno. :) Dicho esto, todavía estaría de acuerdo en que esta es una mejor respuesta. Mi única objeción fue con el énfasis que estabas poniendo en un punto específico.
Noldorin
2
Por cierto, proporcioné un pequeño historial detrás de la función $ en mi publicación aquí: stackoverflow.com/questions/1122690/jquery-and-questions/…
SolutionYogi
44

De otra respuesta :

Una pequeña historia

Recuerde, no hay nada intrínsecamente especial al respecto $. Es un nombre variable como cualquier otro. En días anteriores, la gente solía escribir código usando document.getElementById. Debido a que JavaScript distingue entre mayúsculas y minúsculas, era normal cometer un error al escribir document.getElementById. ¿Debo capital 'b'de 'by'? ¿Debo capital 'i'de Id?usted obtener la deriva. Debido a que las funciones son ciudadanos de primera clase en JavaScript, siempre puede hacer esto:

var $ = document.getElementById; //freedom from document.getElementById!

Cuando llegó la biblioteca Prototype, nombraron su función, que obtiene los elementos DOM, como '$'. Casi todas las bibliotecas de JavaScript copiaron esta idea. Prototype también introdujo una $$función para seleccionar elementos usando el selector CSS.

jQuery también adaptó la $función, pero se expandió para que acepte todo tipo de 'selectores' para obtener los elementos que desea. Ahora, si ya está utilizando Prototype en su proyecto y desea incluir jQuery, tendrá problemas, ya que '$'podría referirse a la implementación de Prototype O a la implementación de jQuery. Es por eso que jQuery tiene la opción de noConflict para que pueda incluir jQuery en su proyecto que usa Prototype y migre lentamente su código. ¡Creo que este fue un movimiento brillante por parte de John! :)

SolutionYogi
fuente
10
var $ = document.getElementById;no funciona en Firefox o Google Chrome. Deberías usar function $(id) { return document.getElementById(id); }en su lugar. Consulte stackoverflow.com/questions/1007340 para obtener más información.
Grant Wagner el
No lo sabía, gracias Grant. Puedo confirmar que esto solía funcionar tanto en IE6 como en Firefox 2 porque frecuentemente usaba esta técnica. Actualizaré mi publicación principal.
SolutionYogi el
42

Es muy probable que sea el código jQuery (más precisamente, JavaScript usando la biblioteca jQuery).

El $representa la función jQuery , y en realidad es un alias abreviado para jQuery. (A diferencia de la mayoría de los idiomas, el $símbolo no está reservado, y puede usarse como un nombre de variable). Normalmente se usa como un selector (es decir, una función que devuelve un conjunto de elementos encontrados en el DOM).

Noldorin
fuente
3
Usted debe agregar que $ es igual que X, podría ser cualquier cosa que asigne a él
Hasen
¿Qué significa este código? $ Input.prop ('type') == 'radio';
OKGimmeMoney
21

Como todas las otras respuestas dicen; puede ser casi cualquier cosa, pero generalmente es "JQuery".

Sin embargo, en ES6 es un operador de interpolación de cadenas en una plantilla "literal" por ejemplo.

var s = "new" ; // you can put whatever you think appropriate here.
var s2 = `There are so many ${s} ideas these days !!` ; //back-ticks not quotes
console.log(s2) ;

resultado:

¡Hay tantas ideas nuevas en estos días!

Beto
fuente
2
Esta es una respuesta útil! Era el que estaba buscando porque sabía que no teníamos jQuery ni ninguna otra biblioteca. Básicamente es una forma de imprimir una variable dentro de una cadena más grande sin usar comillas y signos más, etc.
Oscar Bravo
4

Además de las respuestas anteriores, $no tiene un significado especial en javascript, es gratis para usar en la denominación de objetos. En jQuery , se utiliza simplemente como un alias para el jQuery objeto y jQuery () función. Sin embargo, puede encontrar situaciones en las que quiera usarlo junto con otra biblioteca JS que también use $, lo que provocaría un conflicto de nombres. Hay un método en JQuery solo por esta razón,jQuery.noConflict() .

Aquí hay una muestra de jQuery doc:

<script src="other_lib.js"></script>
<script src="jquery.js"></script>
<script>
$.noConflict();
// Code that uses other library's $ can follow here.
</script>

Alternativamente, también puede usar un como este

(function ($) {
// Code in which we know exactly what the meaning of $ is
} (jQuery));

Ref : https://api.jquery.com/jquery.noconflict/

Vishnu Mallipudi
fuente
3

De la documentación de jQuery que describe el objeto Core de jQuery :

Muchos desarrolladores prefieren un $ al nombre de las variables que contienen objetos jQuery para ayudar a diferenciar. Esta práctica no tiene nada de mágico, solo ayuda a algunas personas a realizar un seguimiento de lo que contienen las diferentes variables.

Josh Britton
fuente