JavaScript Callback Function

In JavaScript, you may have already studied functions and how to use them, but Callback functions differ from normal functions. Callback functions are the most important part of JavaScript. Here in this blog, we will explain to you the Callback function with some coding examples.

A function is a block of code that performs a particular task. For instance, printName() is a function that has a name argument and returns a name to the user.

JavaScript Callback Function
Function Example

I. Callback function

In JavaScript, we can pass a function as an argument to the function. The function which is passed in the argument of another function is known as a Callback function.

For instance, printName() is a function that takes another function myAge as an argument, and then printName() calls the myAge() function inside it.

callback function
Callback Function Example

Now we understood the defination of Callback but why do we need them? Let’s understand this with an example.

II. Why do we need a Callback function?

JavaScript runs code in sequential order, but sometimes a situation or some delay can cause the execution of statements in non-sequential order. However, if you want to wait for the previous function’s result before executing the second function in some cases. This is known as asynchronous programming.

So in such situation, the Callback functions comes to the rescue. They ensure that the second function will not execute before the execution result of the first function. But the second function will execute right after the first one finishes its task.

For instance, In this, we are using the setTimeout() function (execute the block of code after a specified time) to delay the output of the first function.

JavaScript Callback Function
Without CallBack Function

In this, the printName() function is called after 5000 milliseconds, i.e., 5 seconds delay. Because of this delay, the output of the second function is executed before the output of the first function.

In the above example, the second function does not wait for the first function and executes first. However, if we want the second function to execute after the first function, we should use the Callback function. So now, let’s see the program with a Callback.

CallBack function
CallBack Function

In the above example, the statements are executed in sequential order.

III. When we need them

A Callback function is specially used when we have to wait for a result that takes time. For example, we need to fetch data from a specific API, and after that, we need to use API fetched data in the second function. So in such cases, we will use Callback to perform the operations in their specific order.

IV. Conclusion

Hopefully, you completely understood the concept of Callback functions with the help of this blog. In our next blog, we will discuss the promises in JavaScript, which is much similar to this topic.

Some links on this page are affiliate links. This means that if you choose to make a purchase, we may earn a small commission at no extra cost to you. For more information, Go here

Leave a Reply

Your email address will not be published.