JavaScript Callbacks

What is a callback in JavaScript?

A callback in JavaScript is a function that is passed as an argument to another function and is executed after some kind of event or condition occurs. Callbacks are commonly used for asynchronous operations.

How do you define a callback function?

You can define a callback function by creating a function and passing it as an argument to another function.


function greet(name) {
  console.log(`Hello, ${name}!`);
}

function processUserInput(callback) {
  const name = 'Alice';
  callback(name); // Invoking the callback
}

processUserInput(greet); // Outputs: Hello, Alice!

Can you provide an example of a callback function in an asynchronous operation?

Callbacks are often used in asynchronous operations, such as handling the result of an HTTP request.


function fetchData(callback) {
  setTimeout(() => {
    const data = { id: 1, name: 'Alice' };
    callback(data); // Calling the callback with data
  }, 1000);
}

fetchData((data) => {
  console.log('Data received:', data); // Outputs: Data received: { id: 1, name: 'Alice' }
});

What are the advantages of using callbacks?

Advantages of using callbacks include:

Enables handling of asynchronous operations, such as API calls or timers.
Promotes code modularity and reusability by allowing functions to be passed as arguments.
Facilitates event-driven programming, allowing specific actions to be executed when events occur.

What is the difference between synchronous and asynchronous callbacks?

Synchronous callbacks are executed immediately within the function they are passed to, blocking the execution until they complete. Asynchronous callbacks are executed after some delay or event, allowing the program to continue executing without waiting.


// Synchronous callback
function synchronousCallback() {
  console.log('Synchronous callback executed.');
}

function executeSynchronous(callback) {
  callback(); // Executes immediately
}

executeSynchronous(synchronousCallback); // Outputs: Synchronous callback executed.

// Asynchronous callback
function asynchronousCallback() {
  console.log('Asynchronous callback executed.');
}

function executeAsynchronous(callback) {
  setTimeout(callback, 1000); // Executes after 1 second
}

executeAsynchronous(asynchronousCallback); // Outputs after 1 second: Asynchronous callback executed.

What are callback hell and how can you avoid it?

Callback hell refers to the situation where multiple nested callbacks make the code difficult to read and maintain. It can be avoided by:

Using named functions instead of anonymous functions for clarity.
Using promises or async/await to handle asynchronous operations more gracefully.
Breaking down complex callbacks into smaller, modular functions.

How can you handle errors in callbacks?

You can handle errors in callbacks by passing an error object as the first argument to the callback function, following the Node.js convention. This allows the caller to check for errors and respond accordingly.


function fetchData(callback) {
  const error = null; // Simulate no error
  const data = { id: 1, name: 'Alice' };

  // Simulating an error
  // const error = 'Data not found';

  callback(error, data);
}

fetchData((error, data) => {
  if (error) {
    console.error('Error:', error);
  } else {
    console.log('Data received:', data); // Outputs: Data received: { id: 1, name: 'Alice' }
  }
});

What is the purpose of the `setTimeout()` function?

The setTimeout() function is used to execute a function or a specified piece of code after a defined delay (in milliseconds). It is often used to demonstrate asynchronous behavior.


console.log('Start');

setTimeout(() => {
  console.log('Executed after 2 seconds');
}, 2000);

console.log('End');
// Outputs:
// Start
// End
// Executed after 2 seconds

What is the `setInterval()` function?

The setInterval() function repeatedly calls a function or executes a specified piece of code at defined intervals (in milliseconds) until it is stopped using clearInterval().


let count = 0;
const intervalId = setInterval(() => {
  count++;
  console.log(`Count: ${count}`);
  if (count === 5) {
    clearInterval(intervalId); // Stops the interval after 5 counts
  }
}, 1000);
// Outputs: Count: 1, Count: 2, ..., Count: 5 (at 1-second intervals)

Ads

‹ JavaScript Interview