JavaScript Callbacks

Function References:

• Callbacks are simply function references passed as arguments to other functions.

Asynchronous Operations:

• They are commonly used to handle asynchronous operations, such as fetching data from a server or responding to user events.

Example: Basic Callback

function fetchData(callback) {
  // Simulated async operation
  setTimeout(() => {
    const data = 'This is some data';
    callback(data);
  }, 1000);
}

function processData(data) {
  console.log('Processing data:', data);
}

fetchData(processData);

Error Handling:

• Callbacks can also handle errors by passing an error as the first argument to the callback function.

Example: Error Handling

function fetchData(callback) {
  // Simulated async operation
  setTimeout(() => {
    const error = null; // Assume no error
    const data = 'This is some data';
    callback(error, data);
  }, 1000);
}

function processData(error, data) {
  if (error) {
    console.error('Error:', error);
  } else {
    console.log('Processing data:', data);
  }
}

fetchData(processData);

Closure:

• Callbacks can access variables from the surrounding scope, forming closures.

Example: Closure

function outerFunction(callback) {
  const message = 'Hello from outer function';

  function innerFunction() {
    console.log(message);
  }

  callback(innerFunction);
}

outerFunction(function(callback) {
  callback(); // Output: Hello from outer function
});

 

Key Points

• JavaScript callbacks enable asynchronous programming by executing functions after specific tasks complete.
• They allow functions to be passed as arguments, making code more flexible and modular.
• Callbacks are essential for handling events, fetching data, and executing code after certain conditions are met.