-1

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?

whoam_i24
  • 3
  • 2

3 Answers3

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.

Alexander Nenashev
  • 8,775
  • 2
  • 6
  • 17
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.

RAllen
  • 1,235
  • 1
  • 7
  • 10
  • 1
    Also, callbacks can be assigned to properties or attached as event handlers. It's not necessary for them to be passed as arguments though that is how most APIs are written. For example you can have an object `pdfCompiler` and assign a callback: `pdfCompiler.afterCompile = (x) => {console.log(x)}` and which will call that function when you do: `pdfCompiler.compile()`. This kind of callback is more often seen in languages like Java and C++ but it is also a callback and you also see it in some javascript code. – slebetman May 16 '23 at 01:37
  • Thanks @slebetman! I've added an example for this scenario too. – RAllen May 16 '23 at 02:15
-1

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
Asleepace
  • 3,466
  • 2
  • 23
  • 36