How to pass a callback as a parameter into another function

Question

I'm new to ajax and callback functions, please forgive me if i get the concepts all wrong.

Problem: Could i send a callbackfunction as a parameter to another function that will execute the callback?

function firstFunction(){
    //some code

    //a callback function is written for $.post() to execute
    secondFunction("var1","var2",callbackfunction);
}

function secondFunction(var1, var2, callbackfunction) {
    params={}
    if (event != null) params = event + '&' + $(form).serialize();

    // $.post() will execute the callback function
    $.post(form.action,params, callbackfunction);
}

possible duplicate of [Getting a better understanding of callback functions in JavaScript](http://stackoverflow.com/questions/483073/getting-a-better-understanding-of-callback-functions-in-javascript) — ninjagecko, Jun 24 '11 at 10:04

score 144 · Accepted Answer · edited Feb 24 '21 at 12:42

Yup. Function references are just like any other object reference, you can pass them around to your heart's content.

Here's a more concrete example:

function foo() {
    console.log("Hello from foo!");
}

function caller(f) {
    // Call the given function
    f();
}

function indirectCaller(f) {
    // Call `caller`, who will in turn call `f`
    caller(f);
}

// Do it
indirectCaller(foo); // logs "Hello from foo!"

You can also pass in arguments for foo:

function foo(a, b) {
    console.log(a + " + " + b + " = " + (a + b));
}

function caller(f, v1, v2) {
    // Call the given function
    f(v1, v2);
}

function indirectCaller(f, v1, v2) {
    // Call `caller`, who will in turn call `f`
    caller(f, v1, v2);
}

// Do it
indirectCaller(foo, 1, 2); // logs "1 + 2 = 3"

score 13 · Answer 2 · answered Oct 27 '11 at 17:18

13

Also, could be simple as:

if( typeof foo == "function" )
    foo();

answered Oct 27 '11 at 17:18

Brad

413
6
14

score 11 · Answer 3 · edited May 23 '17 at 10:31

11

If you google for javascript callback function example you will get Getting a better understanding of callback functions in JavaScript

This is how to do a callback function:

function f() {
    alert('f was called!');
}

function callFunction(func) {
    func();
}

callFunction(f);

edited May 23 '17 at 10:31

Community

1
1

answered Jun 24 '11 at 10:00

ninjagecko

88,546
24
137
145

Nicola Peluchetti · Answer 4 · 2011-06-24T09:52:14.133

Yes of course, function are objects and can be passed, but of course you must declare it:

function firstFunction(){
    //some code
    var callbackfunction = function(data){
       //do something with the data returned from the ajax request
     }
    //a callback function is written for $.post() to execute
    secondFunction("var1","var2",callbackfunction);
}

an interesting thing is that your callback function has also access to every variable you might have declared inside firstFunction() (variables in javascript have local scope).

score 0 · Answer 5 · answered Dec 05 '13 at 14:37

0

Example for CoffeeScript:

test = (str, callback) ->
  data = "Input values"
  $.ajax
    type: "post"
    url: "http://www.mydomain.com/ajaxscript"
    data: data
    success: callback

test (data, textStatus, xhr) ->
  alert data + "\t" + textStatus

answered Dec 05 '13 at 14:37

nothing-special-here

11,230
13
64
94

what does `->` mean in javascript ?@nothing-special-here – shenkwen Apr 20 '16 at 12:05
`->` is just a normal function. `var test = function(str, callback) { ajax call }` – Barry Jun 22 '16 at 18:34
@shenkwen A thin arrow -> is CoffeeScript syntax, not JavaScript, and simply means a normal JavaScript function when compiled into JavaScript. JavaScript has a similar arrow function https://www.w3schools.com/Js/js_arrow_function.asp – Bryan May 25 '20 at 08:47

score 0 · Answer 6 · answered Oct 14 '19 at 10:52

You can use JavaScript CallBak like this:

var a;

function function1(callback) {
 console.log("First comeplete");
 a = "Some value";
 callback();
}
function function2(){
 console.log("Second comeplete:", a);
}


function1(function2);

Or Java Script Promise:

let promise = new Promise(function(resolve, reject) { 
  // do function1 job
  let a = "Your assign value"
  resolve(a);
});

promise.then(             

function(a) {
 // do function2 job with function1 return value;
 console.log("Second comeplete:", a);
},
function(error) { 
 console.log("Error found");
});

How to pass a callback as a parameter into another function

6 Answers6

Linked

Related