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 Jun 3

Which programming language/environment is more “powerful” than people realize?

What software tool can do more than people realize or give it credit for? ...

READ POST
Follow @ben to see more of their posts in your feed.
RupeshGoud
A Computer Science Nerd !!
Trending on dev.to
Write and deploy a SUPER FAST web site in 30 seconds with no framework.
#beginners #staticsitegenerator #tools #noframeworks
Async function vs. a function that returns a Promise
#javascript #asyncawait #promise #catch
Here's Why You Should Quote Your Variables in Bash
#bash #beginners #devops #linux
[Video] The State of the JavaScript with Addy Osmani
#webdev #javascript
Remembering that "functions are objects" can help in writing more concise code
#javascript
Shine a light on JavaScript performance with Lighthouse
#javascript #webperf #lighthouse #webdev
Better console.logs
#webdev #javascript #devtips #learning
"XY Problem" in the Wild.
#javascript #xyproblem #learnprogramming