JavaScript - Paréntesis en llamada a función

 
Vista:

Paréntesis en llamada a función

Publicado por Victor (2 intervenciones) el 14/05/2016 09:14:57
Hola

Como novato en Javascript esto será un poco chorra para los que tenéis kms pero debo preguntarlo.

He visto que en el addEventListener al llamar una función no se ponen paréntesis normalmente. El caso es que en el ejemplo que pongo (muy sencillo) si no los pongoen saltaalert no me va y si los pongo,sí. Si alguien puede decirme por qué, se lo agradecería.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
<head>
	<title>titulo</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<script type="text/javascript" >
		window.addEventListener('onload',saltaalert(),false);
		function saltaalert(){
			setTimeout("alert('Han pasado 3 segundos')",3000);
		}
 
	</script>
 
</head>
<body>
<h1>Ha cargado la página</h1>
</body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Paréntesis en llamada a función

Publicado por xve (2100 intervenciones) el 14/05/2016 19:47:13
Hola Victor, no lo tengo claro, pero he realizado un par de pruebas que me no entiendo muy bien...

Por ejemplo, tal como comentas en tu código, para el evento onload tanto del window como del document en la función le tienes que poner los paréntesis, sino, no funciona.

Pero, si por ejemplo, generas el evento mousemove o click sobre un id, tienes que quitar los paréntesis, sino no funciona!!!
Este es el ejemplo que he utilizado:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
<head>
	<title>titulo</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
 
<body>
<h1 id="h1">Ha cargado la página</h1>
</body>
 
</html>
<script type="text/javascript" >
	function saltaalert(){
		console.log("OK");
	}
	document.getElementById("h1").addEventListener('mousemove',saltaalert());
</script>


Muy extraño!!! haber si alguien nos puede comentar porque en unos eventos si, y en otros no!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Vainas
Val: 95
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Paréntesis en llamada a función

Publicado por Vainas (258 intervenciones) el 15/05/2016 14:58:14
Buenas:

Una cosa es declarar una funcion y otra cosa es llamarla, es lo que esta pasando en tu caso. Voy a ponerte un ejemplo para que lo veas:

asi declaramos una funcion:

1
var func = function(){ ... };

o tambien:

1
function func(){ ... }

Podemos asignar una funcion a una variable:

1
function myFunc(){ ... }

1
var myVarFunc = myFunc;

En otro orden de cosas podemos desvolver dentro de una funcion una funcion (lo he puesto bien si);

1
2
3
4
function FuncReturn(){
...
return function(){ ...};
}

Como sabemos que la anterior devuelve una funcion podemos asignar esa funcion a una variable. Tomemos la funcion del ejemplo anterior:
Si hago

1
var PrimeraFunc = FuncReturn;
estoy asignando la funcion FuncReturn a PrimeraFunc pero si hago

1
var PrimeraFunc = FuncReturn();
estoy asignando la funcion que se desvuelve.

Todo esto lo he comentado para que se entienda que una cosa es asignar y otra ejecutar y llamar a una funcion (queda claro que llamar una funcion es con parentesis).

Mas cosas. Podemos pasar una funcion a una funcion como parametro

1
2
3
4
function EjecutaMiFunc(variable_function){
....
variable_function();
}

asi que cuando llames a EjecutaMiFunc(saltaalert);

Le estas pasando tu funcion, pero si haces:

1
EjecutaMiFunc(saltaalert());

Ejecutas primero saltaalert y lo que regrese se lo pasas a tu funcion (en este caso no regresa nada con lo que le pasas undefine).


Ahora en cuanto a tu codigo lo siguiente. Por que funciona y por que luego no lo hace...:

1
window.addEventListener('onload',saltaalert(),false);

Al pasar por esa linea antes de pasarle los parametros a addEventListener el saltaalert se ejecuta y por eso a los 3 segundos tienes tu alert en pantalla. El problema es que al entrar dentro del addEventListener y evaluar el primer parametro este no coincide ya que es "load" y no "onload" pero el saltaalert ya se ha ejecutado igual.

Perdon por la parafada.

Si lo has entendido creo que puedes saber donde corregirlo. Animo!!

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
3
Comentar

Paréntesis en llamada a función

Publicado por Víctor (2 intervenciones) el 17/05/2016 06:30:29
Impresionante explicación. Muchísimas gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar