Soy nuevo en JavaScript / jQuery y he estado aprendiendo a crear funciones. Muchas funciones han aparecido con (e) entre paréntesis. Déjame mostrarte lo que quiero decir:
$(this).click(function(e) {
// does something
});Siempre parece que la función ni siquiera usa el valor de (e), entonces, ¿por qué está ahí tan a menudo?
Respuestas:
e es la referencia var corta para event objeto que se pasará a los controladores de eventos.
El objeto de evento tiene esencialmente muchos métodos y propiedades interesantes que se pueden usar en los controladores de eventos.
En el ejemplo que ha publicado es un controlador de clics que es un MouseEvent
$(<element selector>).click(function(e) {
// does something
alert(e.type); //will return you click
}DEMO - Usos de la demo de eventos del mousee.which ye.type
Algunas referencias útiles:
http://api.jquery.com/category/events/
http://www.quirksmode.org/js/events_properties.html
http://www.javascriptkit.com/jsref/event.shtml
DESCARGO DE RESPONSABILIDAD: Esta es una respuesta muy tardía a esta publicación en particular, pero como he estado leyendo varias respuestas a esta pregunta, me sorprendió que la mayoría de las respuestas usan terminología que solo pueden entender los codificadores experimentados. Esta respuesta es un intento de abordar la pregunta original pensando en un público novato.
La pequeña ' (e) ' es en realidad parte del alcance más amplio de algo en Javascript llamado función de manejo de eventos. Cada función de manejo de eventos recibe un objeto de evento. Para el propósito de esta discusión, piense en un objeto como una "cosa" que contiene un montón de propiedades ( variables ) y métodos ( funciones ), al igual que los objetos en otros lenguajes. El identificador, la ' e ' dentro de la pequeña (e) cosa, es como una variable que te permite interactuar con el objeto (y yo uso el término variable MUY libremente).
Considere los siguientes ejemplos de jQuery:
$("#someLink").on("click", function(e){ // My preferred method
e.preventDefault();
});
$("#someLink").click(function(e){ // Some use this method too
e.preventDefault();
});¿Qué esta pasando?
Cuando un usuario hace clic en el elemento con la identificación "#someLink" (probablemente una etiqueta de anclaje), llame a una función anónima, "función (e)" , y asigne el objeto resultante a un controlador, "e" . Ahora tome ese controlador y llame a uno de sus métodos, "e.preventDefault ()" , que debería evitar que el navegador realice la acción predeterminada para ese elemento.
Nota: El identificador puede llamarse prácticamente como quieras (es decir, ' función (billybob) '). La 'e' significa 'evento', que parece ser bastante estándar para este tipo de función.
Aunque 'e.preventDefault ()' es probablemente el uso más común del controlador de eventos, el objeto en sí contiene muchas propiedades y métodos a los que se puede acceder a través del controlador de eventos.
Se puede encontrar información realmente buena sobre este tema en el sitio de aprendizaje de jQuery, http://learn.jquery.com . Preste especial atención a las secciones Uso de jQuery Core y Eventos .
eno tiene ningún significado especial. Es solo una convención para usar ecomo nombre de parámetro de función cuando el parámetro esevent .
Puede ser
$(this).click(function(loremipsumdolorsitamet) {
// does something
}también.
En ese ejemplo, ees solo un parámetro para esa función, pero es el eventobjeto que se pasa a través de él.
El eargumento es la abreviatura del objeto de evento. Por ejemplo, es posible que desee crear un código para anclajes que cancele la acción predeterminada. Para hacer esto, escribirías algo como:
$('a').click(function(e) {
e.preventDefault();
}Esto significa que cuando un <a> se hace clic etiqueta, se evita la acción predeterminada del evento de clic.
Si bien puede verlo a menudo, no es algo que deba usar dentro de la función, aunque lo haya especificado como un argumento.
En jQuery, eabreviatura de eventobjeto de evento actual. Por lo general, se pasa como un parámetro para que se active la función de evento.
Demostración: eventos de jQuery
En la demostración que usé e
$("img").on("click dblclick mouseover mouseout",function(e){
$("h1").html("Event: " + e.type);
}); Yo también pude haber usado event
$("img").on("click dblclick mouseover mouseout",function(event){
$("h1").html("Event: " + event.type);
}); ¡La misma cosa!
Los programadores son perezosos, usamos muchas taquigrafía, en parte disminuye nuestro trabajo, en parte ayuda con la legibilidad. Comprender eso te ayudará a comprender la mentalidad de escribir código.
Hoy acabo de escribir una publicación sobre "¿Por qué usamos letras como" e "en e.preventDefault ()?" y creo que mi respuesta tendrá algún sentido ...
Primero, veamos la sintaxis de addEventListener
Normalmente será: target.addEventListener (type, listener [, useCapture]);
Y la definición de los parámetros de addEventlistener son:
tipo : una cadena que representa el tipo de evento a escuchar.
oyente : el objeto que recibe una notificación (un objeto que implementa la interfaz de eventos) cuando ocurre un evento del tipo especificado. Debe ser un objeto que implemente la interfaz EventListener o una función de JavaScript.
(De MDN)
Pero creo que hay una cosa que se debe remarcar: cuando usas la función Javascript como oyente, el objeto que implementa la interfaz del evento (evento del objeto) se asignará automáticamente al "primer parámetro" de la función. Entonces, si usas function (e), el objeto se asignará a "e" porque "e" es el único parámetro de la función (¡definitivamente el primero!), entonces puedes usar e.preventDefault para evitar algo ....
probemos el ejemplo de la siguiente manera:
<p>Please click on the checkbox control.</p>
<form>
<label for="id-checkbox">Checkbox</label>
<input type="checkbox" id="id-checkbox"/>
</div>
</form>
<script>
document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
//var e=3;
var v=5;
var t=e+v;
console.log(t);
e.preventDefault();
}, false);
</script>el resultado será: [object MouseEvent] 5 y evitará el evento de clic.
pero si elimina el signo de comentario como:
<script>
document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
var e=3;
var v=5;
var t=e+v;
console.log(t);
e.preventDefault();
}, false);
</script>obtendrá: 8 y un error : "Uncaught TypeError: e.preventDefault no es una función en HTMLInputElement. (VM409: 69)".
Ciertamente, el evento de clic no se evitará esta vez, porque la "e" se definió nuevamente en la función.
Sin embargo, si cambia el código a:
<script>
document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
var e=3;
var v=5;
var t=e+v;
console.log(t);
event.preventDefault();
}, false);
</script>todo volverá a funcionar correctamente ... obtendrá 8 y se evitará el evento de clic ...
Por lo tanto, "e" es solo un parámetro de su función y necesita una "e" en su función () para recibir el "objeto de evento" y luego realizar e.preventDefault (). Esta es también la razón por la que puede cambiar la "e" por cualquier palabra que no esté reservada por js.
$(this).click(function(e) {
// does something
});En referencia al código anterior
$(this)es el elemento que como alguna variable.
clickes el evento que debe realizarse.
el parámetro ese pasa automáticamente de js a su función, que contiene el valor de $(this)value y se puede usar más en su código para realizar alguna operación.