How do closures enable Callbacks

Q: How do closures enable Callbacks

function fetchData(url, callback) { // ... fetching data from 'url' const data = '...'; callback(data); } fetchData('https://example.com/api/data', function(data) { console.log('Received data:', data); });

Difficulty: 6/10

Closures, Asynchronous JavaScript, Scope & Memory Management

Callbacks: Closures are frequently employed as callback functions. Callbacks are functions passed as arguments to other functions, and they're executed at a later time or upon a specific event. Closures can capture variables from their surrounding context, making them useful for customizing behavior in asynchronous operations.

Scenario Questions

0-2 years experience

1Imagine you're building a simple search-as-you-type input. You want to debounce the API calls so you don't hit the server on every keystroke. How would you write a helper function that keeps track of the timer ID across multiple keystrokes without using global variables?
2We have a loop that sets up five buttons, and we want each button to alert its index (0 to 4) when clicked. If we use a standard 'for' loop with 'var i = 0', all buttons alert '5'. How does changing 'var' to 'let' fix this, and what is happening under the hood with the click callback's scope?
3You are writing a function 'fetchUserData(userId, callback)'. Inside, you make an async fetch call, and when it resolves, you want the callback to access both the fetched data and the original 'userId' passed to the parent function. How does JavaScript ensure the callback still has access to 'userId' even after 'fetchUserData' has already finished executing?

How do closures enable Callbacks

Scenario Questions

Follow-up Questions

How do closures enable Callbacks

Scenario Questions

Follow-up Questions