Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

How to understand JavaScript callbacks ? Are they covered somewhere on this site ? I need to get over them ,but how ?

Hello, I've been going through JS Callback functions ( higher order functions ) , but I can't get my head around them, as far as I am concerned, they are something that satan made on his holidays! I have like minimal knowledge of it, i tried looking on the internet, but I couldn't find it explained good enough so that even I would understand, is there maybe a course you would recommend here ? Or anything that would help me understand them better? Thank you very much.

2 Answers

Kaetlyn McCafferty
Kaetlyn McCafferty
12,193 Points

I find it easiest, on a very basic level, to think of callback functions as functions that are used as arguments when calling other functions (in other words, a function that is "called back" upon when that function runs). For example, jQuery's $.getJSON() method (function) takes three arguments: a URL, data, and a function (simply known as a callback function). That function is executed, or called back, when the $.getJSON() method is called. For example, lets say you want to display stuff available in the "fruits" category in a grocery store. The available fruit will show up as a list in a div on the web page. In order to get those items to show up, you need a function that will execute after the jQuery gathers up the information about the available fruits. This function will basically append the list of available fruits to the div.

It would look something like this...

function displayFruits (data) { 
    //in here would go things that would edit the HTML 
   //and use the information from the database about available fruit
   //in order to create a list of it when the function is called.
 }

$.getJSON (URLtothedatabase, data, displayFruits);

So in this case, our displayFruits is a function that is used as an argument in the $.getJSON() method. This means it's a callback function.

Callback functions aren't written or treated any differently than regular functions, they are only APPLIED, or called, differently.

At least, that's what Ive gathered. Someone else here may have more knowledge on the subject.

I think that I finally understood it, the main problem I had was with : declaration of the callback, like : function input (option, callback){return callback(option)} and similar items, I always got confused as to why we had to write callback(option), but now I understand it, and I am feeling bad, because it is so simple, yet it took me so long to understand it.

Looks like the AJAX Basics course covers it.

Happy learning!