Why do not I need to pass parameters to this function?

Question

Why do not I need to pass parameters to this function?

Navigation

#1 by (4 votes)
#2 by (3 votes)
#3 by (1 votes)

5

I would like to know how function passing as a parameter in JS works, I'm starting the language now and I needed to make a call of EventListenner

document.getElementsByClassName("informacao")[0].addEventListener("mouseover", troca(banner2));

I would also like to know why it does not accept troca(banner2) in the declaration with the parameters of my function, but accepted if I pass only the name of the function or declare as an anonymous function ( function(){} ). Thanks!

javascript eventos

asked by anonymous 26.02.2016 / 21:51

3 answers

How to remove a link from a string in javascript? Function processing time

score 4 · Answer 1

The solution would look like this:

document.getElementsByClassName("informacao")[0].addEventListener("mouseover",
 function() { troca(banner2) });

troca(banner2) is a function call. addEventListener does not expect a function call but rather a function. This function() { } that I put around your code creates a function that, in turn, will make the call you want at the time the event occurs.

Maybe it helps to think that the body of troca could come within this anonymous function (so it would not be a function inside the other). This way, there is simply an indirection (and a passage of parameters)

score 3 · Answer 2

In Javascript, the value of the expression troca(banner2) is the return value of troca . When you call

blah.addEventListener("mouseover", troca(banner2));

It's like you've written

var tmp = troca(banner2);
blah.addEventListener("mouseover", tmp);

As addEventListener expects to receive a function as a parameter you must either pass the direct function (by name, without parentheses), or pass an anonymous function or some other expression whose value in the end is a function.

score 1 · Answer 3

First thing to consider is that in JavaScript functions are first class objects, which means that they can be assigned to variables and passed as arguments to other functions in the same way as you would with a string or a number or an array or etc ...

So it's perfectly natural to do something like this:

var minhaFuncao = function( mensagem ) {
    console.log( mensagem );
};

// ou...

var minhaOutraFuncao = funcaoQueFazAlgumaCoisa;

function funcaoQueFazAlgumaCoisa( mensagem ) { console.log( mensagem ); }

And then this:

minhaFuncao( "Chamando minhaFunção!" );

// ou...

minhaOutraFuncao( "Chamando minhaOutraFuncao" );

// ou...

funcaoQueFazAlgumaCoisa( "Chamando funcaoQueFazAlgumaCoisa" );

With this in mind, consider the following function:

function passeMeUmaFuncaoQualquer( mensagem, umaFuncaoQualquer ) {
    umaFuncaoQualquer( mensagem );
}

The function above expects to receive as a first argument a string and as a function, then we could invoke it as follows:

passeMeUmaFuncaoQualquer( "Olá, Mundo!!!", function( msg ) { console.log( msg ) } );

// ou...

function umaFuncaoQualquer( msg ) {
    console.log( msg );
}

passeMeUmaFuncaoQualquer( "Olá, Mundo!!!", umaFuncaoQualquer );

And your self does this:

passeMeUmaFuncaoQualquer( "Olá", "Mundo" );

It will generate an error, because it would be the same thing to do:

"Mundo"();

And you can not call a string, right?

Now, if I do the way you've demonstrated:

passeMeUmaFuncaoQualquer( "Olá, Mundo!!!", umaFuncaoQualquer() );

What happens is that I invoking umaFuncaoQualquer and passing the value returned by it (whatever it is) as the second argument of passeMeUmaFuncaoQualquer , which generates an error.