Function with function as parameter

Question

I'm trying to define a function that should call a(nother) function that is passed as parameter of the main function.

function showMessage(title, text, button, callback) {

    console.log(title, text, button);

    if (typeof (callback) != "function") {
        function callback() {};
        alert("converted callback");
    }

    $("div").click( function() {
        callback();
    });

}

function myfunction() {
    alert("function!");
}

showMessage("title", "text", "button", myfunction() );

Demo: http://jsfiddle.net/XvE8D/1/

The problem is that when showMessage() function is called, myfunction() is called istantly.

How can I fix the problem?

It is called instantly because you are calling it. :) myfunction() <-- () says run! — epascarello
– epascarello, Commented Nov 7, 2013 at 16:30

p.s.w.g · Accepted Answer · 2013-11-07 16:28:50Z

5

As you've observed, myfunction() with parentheses invokes myfunction.

Try passing myfunction to showMessage without parentheses:

showMessage("title", "text", "button", myfunction);

Also, in showMessage you'll have to change this part:

if (typeof (callback) != "function") {
    function callback() {};
    alert("converted callback");
}

To this:

if (typeof (callback) != "function") {
    callback = function() {};
    alert("converted callback");
}

To pass additional parameters to myfunction, you can wrap myfunction in another function and pass that to showMessage. Something like this should work:

showMessage("title", "text", "button", function() { myfunction('foo'); });

edited Nov 7, 2013 at 16:28

answered Nov 7, 2013 at 16:11

p.s.w.g

150k31 gold badges307 silver badges338 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Fez Vrasta Over a year ago

thanks but what if I need to pass params to the callback? Do I need to pass them first to the showMessage and then pass them to the callback?

p.s.w.g Over a year ago

@FezVrasta That depends. Are the parameters to the callback known at the time you call showMessage or are they only known when the user clicks the element?

Fez Vrasta Over a year ago

Thanks, I've used the $.noop from @Arun P Johny's answer and the rest from yours.

Arun P Johny · Accepted Answer · 2013-11-07 16:12:41Z

2

You need to pass a function reference as the callback argument, in your case you are invoking the function and is assigning the value returned by myfunction(in this case undefined) as the callback argument.

Also see the use $.noop()

function showMessage(title, text, button, callback) {   
    console.log(title, text, button);

    callback = callback || $.noop;

    $("div").click(function(){
        callback('my params')
    });
}

function myfunction() {
    alert("function!");
}

showMessage("title", "text", "button", myfunction);

answered Nov 7, 2013 at 16:12

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

2 Comments

Fez Vrasta Over a year ago

What if I need to pass a parameter to myfunction?

Fez Vrasta Over a year ago

Ok so I need to pass the params of the function as separated params of the showMessage function right?

Collectives™ on Stack Overflow

Function with function as parameter

2 Answers 2

3 Comments

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Linked

Related