Question 169362 in Javascript Question posted in
A very good W3school tutorial can be found here.

What is a Javascript callback?

MDN says that a callback is a function that is passed as an argument to another function. As far as I understand, it means callback is included within parentheses. This is the link.

But, I once came across an article on Freecodecamp saying that callback is a function that is similarly described by MDN, while a callback function is a function that is included in another function block. It means that callback function acts as the child function.

Am I wrong or there’s just some confusion between the two sources?

Tags:

3

Answers


  1. 0

    A callback is ANY function that passed to another function as an argument and meant to be called back, invoked somewhere inside the receiver function. The rest isn’t so important. You can assign a function to a variable and pass the variable as a callback too since in JS function are first-class objects, instances of the Function class/function.

    Login or Signup to reply.
  2. 0

    A function defined within the scope of another function is called a closure

    function outer() {
   let str1 = "Hello, "
   return function inner() {
       return str1 + "world!"
   }
}

console.log(outer()())

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

    A function passed as an argument to another function is called a callback

    https://developer.mozilla.org/en-US/docs/Glossary/Callback_function

    function one() {
   return " world!"
}

function two(callback) {
    return "hello" + callback()
}

console.log(two(one))

    Update

    Don’t worry about the terminology that much, the key takeaways here should be

    • Functions are first class objects in Javascript (learn more)
    • How surrounding scope and closures work
    Login or Signup to reply.
  3. 0

    The word callback means that a function will be called back by some code at some point in time. The word callback doesn’t specify or mean the way how callback function is defined.

    Usually, a callback is a function passed as an argument to another function. The body of the callback function can reside in a global scope or within the other function or class method.

    For example:

    const callback = () => console.log('Hello, world');
setTimeout(callback, 1000);

    In this case, the body of the callback is defined in the global space, and it is passed as an argument to setTimeout.

    Second option:

    const startMyTimer = () => {
  const callback = () => console.log('Hello, world');
  setTimeout(callback, 1000);
};

    In this case, the callback is defined in the body of another function, startMyTimer, and passed as an argument to setTimeout.

    Third option:

    const startMyTimer = () => {
  setTimeout(() => console.log('Hello, world'), 1000);
};

    Here the body of the callback is declared within the setTimeout function call and passed into it as a parameter.

    Array example:

    const callbacks = [
  () => console.log('hello'),
  () => console.log('world'),
];

callbacks.forEach((cb) => cb());

    This example demonstrates that callbacks do not necessarily need to be passed as a parameter but can also be stored in variables or arrays.

    Saved callback scenario, based on @slebetman’s comment:

    class MyObject {
    constructor() {
        this.callback = null;
    }
    runIt() {
        // do some work here
        // ...
        // and then call the callback
        this.callback();
    }
}

const obj = new MyObject();
obj.callback = () => console.log('Hello, world!');
obj.runIt();

    This shows that a callback can be saved as a field of an object and then executed after some work is done.

    Please let me know if this helps.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search