JavaScript Callbacks


Function Sequence

JavaScript functions are executed in the sequence they are called. Not in the sequence they are defined.


The JavaScript apply() Method

The apply() method is similar to the call() method (previous chapter).

In this example the fullName method of person is applied on person1:

Example
function myFirst() {
  myDisplayer("Hello");
}

function mySecond() {
  myDisplayer("Goodbye");
}

myFirst();
mySecond();


Sequence Control

The difference is:

Sometimes you would like to have better control over when to execute a function.

Suppose you want to do a calculation, and then display the result.

call() method takes arguments separately.

You could call a calculator function ( myCalculator ) , save the result, and then call another function (myDisplayer) to display the result:

Example
function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
}

function myCalculator(num1, num2) {
  let sum = num1 + num2;
  return sum;
}

let result = myCalculator(5, 5);
myDisplayer(result);


JavaScript Callbacks

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

Using a callback, you could call the calculator function (myCalculator) with a callback, and let the calculator function run the callback after the calculation is finished:


When to Use a Callback?

he examples above are not very exciting.

They are simplified to teach you the callback syntax.

Where callbacks really shine are in asynchronous functions, where one function has to wait for another function (like waiting for a file to load).

Asynchronous functions are covered in the next chapter.