Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

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!