Skip to main content

JavaScript: Callback function

In javascript callback functions are a very cool feature that is used often. A callback function in javascript can call other functions from within a function.

A function is a first-class object as we know where we can pass objects into functions as arguments. In the same way, we can pass other functions into a function as an argument.

Syntax

var func1 = function()
{
    //Body
}

var func2 = function(callback) 
{
    //Body
    callback()
}

func2(func1);

Example

var x = function() 
{
    console.log("Called From Within A Function")
}

var y = function(callB)
{
    console.log('The Callback Function')
    callB()
}

y(x);

Output:

The Callback Function
Called From Within A Function

Here is a simple example of a function x which is a normal function that is accessed via the next function y which was called via the parameter callB and was passed in the function name x within y as the argument. Which in turn called the function within another function.

So this is a simple example of how the callback function is working let us see a calculator example where we can understand how this is used practically in the real scenario.

Example: Calculator

So in a scenario where you wanna use the attribute another function has from a separate function and wanna be accessed via a separate function. We can use a callback in such a scenario.

let addition = function(x, y)
{
    return x + y;
}

let multiplication = function(x, y)
{
    return x * y;
}

let division = function(x, y)
{
    return x / y;
}

let modulus = function(x, y)
{
    return x % y;
}

let calculator = function(num1, num2, callBack)
{
    return callBack(num1, num2)
}

console.log(calculator(10, 5, addition))
console.log(calculator(10, 5, multiplication))
console.log(calculator(10, 5, division))
console.log(calculator(11, 5, modulus))

Output: 

15
50
2
1
  • So here we have addition, multiplication, division, modulus functions each with its unique attributes to perform an arithmetic operation.
  • So here we can do the callback function of accessing every function's attributes from within a master function and perform each function operation separately from one place.
  • The callback function method is ideal to use here in such a place where the body of each function can be accessed via the parameter callBack when passed in with the required function name which we wanna call back.
  • Here, in this case, we have done a simple calculator using callback function where when the respective function is passed onto the callBack parameter as an argument it immediately invokes the function body above which we wanna access.
Tags
Submitted by arilio666 on November 1, 2021

Ashwin is working with iVagus as a Technical Lead. He has experience in various technologies like Cypress, JavaScript, TypeScript, Rest Assured, Selenium, Cucumber, and Java.

About

At ProgramsBuzz, you can learn, share and grow with millions of techie around the world from different domain like Data Science, Software Development, QA and Digital Marketing. You can ask doubt and get the answer for your queries from our experts.