Callbacks in JavaScript: Why They Exist

Imagine this… You’re in the final circle of BGMI. Only three players are left. Your heart is racing. You spot an enemy hiding behind a rock. You throw a grenade.

Now… nothing happens instantly. There’s a pause.

Then suddenly BOOM! And right after that… “Enemy knocked!”

Now think carefully… Did you control when the enemy got knocked?

No.

You only decided one thing: “What should happen after the grenade explodes?”

And that… is exactly what JavaScript callbacks are.

In JavaScript, we often start an action, wait for it to finish, and then decide what should happen next. That “what happens next” is called a callback.

• What do you think happens if we don’t define what comes next?

• Can the program decide on its own?

Functions as Values

In JavaScript, functions are treated as first-class citizens, meaning they can be used like any other value. You can assign functions to variables, pass them as arguments, and return them from other functions.

Understanding function is essential before learning callbacks.

Example:

In BGMI, items like guns, grenades, and medkits can be:

• Stored in inventory

• Shared with teammates

• Used when needed

Functions behave the same way in JavaScript.

function heal() {
  console.log("Player healed!");
}

let action = heal;
action();

What is a Callback Function?

Callback function is a function passed into another function as an argument. It is executed after the main function completes its task.

They are widely used to handle operations that depend on previous results.

Example:

You tell your teammate:

After I throw the grenade… you rush.

You’re defining an action that happens after another action finishes.

function throwGrenade(callback) {
  console.log("Grenade thrown...");
  callback();
}

function rushEnemy() {
  console.log("Rushing enemy!");
}

throwGrenade(rushEnemy);

Why Callbacks Are Used (Asynchronous Programming)

JavaScript often deals with tasks that take time, such as network requests or timers. These tasks are called asynchronous operations because they don’t finish immediately.

Callbacks allow code to run only after these operations are completed.

Example:

Reviving a teammate takes time

• You start revive

• Wait 5 seconds

• THEN teammate stands up

You can’t instantly execute the next step.

function revive(callback) {
  console.log("Reviving...");

  setTimeout(() => {
    console.log("Teammate revived!");
    callback();
  }, 3000);
}

revive(() => {
  console.log("Cover fire started!");
});

Passing Functions as Arguments

Functions can be passed as arguments to other functions just like numbers or strings. This allows creating generic and reusable functions.

The behavior of a function can change based on the function passed to it.

Example:

Squad leader gives strategies:

If close → rush

If far → snipe

Same function, different behavior depending on what you pass.

function performAction(action) {
  action();
}

function rush() {
  console.log("Rush!");
}

function snipe() {
  console.log("Snipe!");
}

performAction(rush);
performAction(snipe);

Common Callback Use Cases

Callbacks are commonly used in timers, event handling, and API calls. They help define what should happen after an operation completes.

Example:

In BGMI:

• After looting → inventory updates

• After match ends → results show

• After healing → health increases

Actions trigger follow-up actions.

setTimeout(() => {
  console.log("Zone shrinking!");
}, 2000);

function fetchData(callback) {
  setTimeout(() => {
    callback("Data received");
  }, 2000);
}

fetchData((data) => console.log(data));

Callback Nesting (Callback Hell)

When callbacks are nested inside other callbacks, the code becomes difficult to read. This structure is often called callback hell.

It makes debugging and maintaining code more challenging.

Example:

Plan becomes too complex:

• Revive → heal → reload → rush

Too many steps…

revive(() => {
  heal(() => {
    reload(() => {
      attack(() => {
        console.log("Done!");
      });
    });
  });
});

Note: In BGMI, every move depends on what just happened.
In JavaScript, callbacks define those next moves.