How can I implement debouncing in JavaScript?

How can I implement debouncing in JavaScript?

Debouncing is a technique used to limit the rate at which a function is executed. You can implement it using a simple timeout. Would you like to see a code example?

Yes, please provide a code example.

Here's a basic example:

function debounce(func, delay) {
    let timeout;
    return function(...args) {
        clearTimeout(timeout);
        timeout = setTimeout(() => func.apply(this, args), delay);
    };
}

const handleResize = debounce(() => {
    console.log('Window resized!');
}, 300);

window.addEventListener('resize', handleResize);

How does this code work?

The debounce function returns a new function that delays the execution of func until after delay milliseconds have passed since the last time it was invoked. This is useful for events like resizing or scrolling.