CODEWITHSUNDEEP
javascript
leonsas
leonsas

Reputation: 4898

Code convention for function and callbacks

So I started learning javacript and I've noticed that the coding convention for functions and callbacks is something like this (this is a jQuery example but I've seen these everywhere):

$.getJSON('some/url.json', function(a) {
// do stuff with a here
});

Coming from other languages, I would usually write the above as this:

function myFunction(myVar){
//do stuff with myVar here
};

$.getJSON('some/url.json', myFunction());

Why is the former usually the preferred way of writing in JS, instead of the [probably more readable] latter?

Upvotes: 2

Views: 923

Answers (3)

Scott Sauyet
Scott Sauyet

Reputation: 50797

There are plenty of good reasons to use the second, more explicit, format (assuming you fix the issue listed in the comment), including:

  • reusing the function passed as a callback
  • giving that function a definitive name to make it easier to debug
  • making sure that function is noted as something important in your system
  • separating out that functions because it's simply too long to comfortably declare in place

But the first format, with an anonymous function passed as a callback is short and sweet. If you don't need to reuse the function, if it's relatively short, and if it's not of high importance in your system, it can be really useful to declare it exactly where you use it. You avoid adding another variable to your scope, and you make it entirely clear exactly what that function is for.

Upvotes: 2

Jer In Chicago
Jer In Chicago

Reputation: 828

Your first example is what is referred to as an anonymous function or block. They are used when they'll only be called once. The second example is when you'd use the function many times... it would be a lot of wasteful typing if you repeated the anonymous block over and over.

Upvotes: 0

hvgotcodes
hvgotcodes

Reputation: 120198

It's not the preferred way. You can do anything you want. However, if you need to reuse the function, then you need to do your second option, or alternatively the following, for code reuse:

// in some accessible context/namespace
App.myCallback = function(a){
...
};

// somewhere else
$.getJSON('url', App.myCallback);

Upvotes: 1

Related Questions