CODEWITHSUNDEEP
javascriptjquery
Rafael Baptista
Rafael Baptista

Reputation: 11499

Why does .done() require an anonymous function?

Why does this work:

$.ajax({ url: urlIn, dataType: 'json', cache: false })
     .done( function( data ) { doStuff( data ) });

But not this:

$.ajax({ url: urlIn, dataType: 'json', cache: false })
     .done( doStuff( data ) );

That second one "data" is not defined. It took me a while to realize that was the problem. But its mysterious to me why it works like that.

Upvotes: 0

Views: 143

Answers (4)

nicael
nicael

Reputation: 19014

It doesn't. It just requires function reference, and not calling a function. Anonymous function (function(){}) would be correct function reference, so as doStuff. But by doing doStuff(), you are calling this function directly and you can't use doStuff as you need to pass parameters. So you should use function( data ) { doStuff( data ) }.

Upvotes: 1

jfriend00
jfriend00

Reputation: 707976

It does not require an anonymous function. You do have it pass it a function reference though. So, in your example, this would work just fine:

$.ajax({ url: urlIn, dataType: 'json', cache: false })
     .done( doStuff );

What you were doing was calling doStuff(data) immediately and passing the return value of that to .done() which was likely not a function reference. You must pass a function reference (without the parens - because the parens cause it to execute immediately).

This is a very common mistake. Functions without the parens are a reference to that function that can then be called later. Functions with the parens are executed immediately and the return value from executing the function is passed instead.

Upvotes: 1

David
David

Reputation: 219037

Because those aren't the same thing.

This is a function definition:

function( data ) { doStuff( data ) }

This is a function invocation:

doStuff( data )

It's telling the code to execute doStuff(data) now and use its result as the callback function. Since data doesn't exist yet, that won't work. (And if doStuff doesn't return a function, that won't work.)

The analogous version is simply this:

$.ajax({ url: urlIn, dataType: 'json', cache: false })
 .done( doStuff );

data will be passed in automatically.

Upvotes: 6

Marius Schulz
Marius Schulz

Reputation: 16470

By calling .done( doStuff( data ) ), you're actually invoking the doStuff function immediately. What gets passed to the done function is its return value, which is equal to undefined in your case.

Now, if the doStuff function were to return a function itself, that returned function could then be called as a callback by doStuff.

What you want to do instead is pass the function as a value without invoking it right away:

$.ajax({ url: urlIn, dataType: 'json', cache: false }).done(doStuff);

Upvotes: 10

Related Questions