Explain Callback Like I'm Five

Did you find this post useful? Show some love!
DISCUSSION (4)

Callbacks are friends we send along inside functions to help accomplish additional tasks.

I'm going to send you to the store with money to get groceries. But I need to know how you're doing at the store. So I'm also going to send your friend, and he'll call back home and let me know how things are going. I might even ask him to do other things for me, like drive you home with the groceries.


function getGroceries(shoppingList, friend) {

    this.purchase(shoppingList)

    if(friend)
    {
        friend(this.purchase)
    }

    return this.purchase

}

function friend(purchase) {
    console.log(`Hey mom, we bought everything. Here's the reciept`)
    console.log(purchase)
}

const shoppingList = [ 'apples', 'carrots', 'chips' ]

getGroceries(shoppingList, friend)

Sometimes, you need friends to do certain things, like setting a timeout (as exhibited by @nestedsoftware ). That's a 2-person job, someone to set the time and someone to actually do something.

A callback is a function that you pass in as a variable to another function. A typical example in JavaScript is the setTimeout function. If you want something to execute after a delay, you can pass it as a callback to setTimeout.

function sayHello() {
    console.log('Hello there!');
}

setTimeout(sayHello, 1000);

setTimeout will wait 1 second (1000 milliseconds) and then it will actually call sayHello. The result is that "Hello there!" will get printed to the console after one second.

Because it takes a function as an argument, setTimeout is called a "higher order function."

Classic DEV Post from Apr 11

What do you do on a daily basis for your job?

...

RupeshGoud
A Computer Science Nerd !!

DEV is a social network for software developers to level up their craft. It's free and it's fully open source.

Sign up