home ~ projects ~ socials

Trying To Figure Out Josh W. Comeau's Debouncer In An Event Listener

TL;DR

I'm using Josh's debouncer script snippet. I've got it working using a `const doUpdate1 = debounce((event) => {}, 100)approach, but can't figure out how to do it if the function is defined with `function.

Details

Josh's script looks like this:

JavaScript

function debounce(callback, wait) {
  console.log("- in debounce")
  let timeoutId = null;
  return (...args) => {
    window.clearTimeout(timeoutId);
    timeoutId = window.setTimeout(() => {
      callback.apply(null, args);
    }, wait);
  };
}

Given these two buttons:

HTML

<div class="buttons">
<button class="clicker1">Clicker 1</button>
<button class="clicker2">Clicker 2</button>
</div>

Output

This is breaking my understanding of javascript a little. I thought using `returnin `doUpdate2 would produce the same result.

I'm not sure what's going on here. I'm over on Mastodon if you've got suggestions.

-- end of line --

References